相关疑难解决方法(0)

我正在尝试以编程方式使用Chrome(Build 43)中的execCommand将异步JSONP请求的结果复制到剪贴板.这是一个逻辑片段:

loadContent()

function loadContent(callback) {
  $.getJSON('http://www.randomtext.me/api/lorem/p-5/10-20?&callback=myFunc',function(result){
    console.log('result=',result.text_out);
    $("#container").html(result.text_out);
    if (callback) {
      callback();
    }
  });
}

function copyAjax() {

 loadContent(copy);

}

function copy() {
  var copyDivText = $('#container').text();
  console.log('copyDivText=',copyDivText);
  executeCopy(copyDivText);
}

document.addEventListener("DOMContentLoaded", function(){
      document.getElementById("copy").onclick = copy;
    });


document.addEventListener("DOMContentLoaded", function(){
      document.getElementById("copyAjax").onclick = copyAjax;
    });


// Copy text as text
function executeCopy(text) {
    var input = document.createElement('textarea');
    document.body.appendChild(input);
    input.value = text;
    input.focus();
    input.select();
    document.execCommand('Copy');
    input.remove();
}

我知道你开始编译的43代Chrome使用execCommand和剪贴板.但问题是,您需要在执行用户发起的事件(其中权限被提升)中执行此操作.这是ZeroClipboard基于闪存的解决方案所具有的类似限制.除了得到一个不可能的答案(这是我现在正在思考的问题)之外,这些是我想做的其他选择(警告,它们都是Hail Mary Passes):

1. 由于JSONP不能同步,因此将其转换为使用常规AJAX调用的内容,并确保AJAX调用在用户事件的执行上下文中是同步的.这违背了我根深蒂固的信念,即我们不应该进行同步XHR调用,因为它会降低用户体验.
2. 当用户使用鼠标接近复制按钮时,我们会抢先发送服务器请求,并希望在用户单击按钮之前足够快.这是一个明显的竞争条件,可能不是时间的一部分,并且当用户想要执行Ctrl/Command-C而不是单击复制按钮时将无法确定.
3. 执行两个步骤.单击以触发呼叫,当内容可用时,显示内容可用的消息,然后再次单击消息区域以复制到剪贴板.它似乎不是最好的UX互动.我用这个替代方法创建了这个例子.以编程方式触发单击不构成用户问题事件.
4. 可能有一种方法可以创建简单的Chrome扩展程序,并允许用户将该扩展程序的权限设置为复制到剪贴板.这涉及但最终用户必须安装和扩展并更改本地浏览器设置.不确定很多用户是否有能力/愿意这样做.

我已经看过成问题,#2,如 …

我不能直接复制生成的链接(没有ctrl + C)我是usign document.execCommand('copy')但它似乎没有效果. 如果代码没有AJAX那么它的工作就完美了.这是

• 与AJAX的小提琴链接

• 没有AJAX的小提琴链接

HTML:

<div class="permalink-control"> </div>

JQUERY:

    $(".permalink-control")
          .append(
            '<div class="input-group">' +
            '    <span class="input-group-btn"><button type="button" class="btn btn-default" title="Get Permalink"><span class="glyphicon glyphicon-link"></span></button></span>' +
            '    <input type="text" class="form-control">' +
            '</div>'
          );
        $(".permalink-control input")
          .hide()
          .focus(function () {
            // Workaround for broken selection: https://stackoverflow.com/questions/5797539
            var $this = $(this);
            $this.select()
              .mouseup(function () {
                $this.unbind("mouseup");
                return false;
              });
          });
        $(".permalink-control button")
          .click(function () {
            var $this = $(this);
            $.ajax({
              url: "https://api-ssl.bitly.com/shorten",
              dataType: "jsonp",
              data: { …