2017-10-13 112 views
1

我有一个ajax方法,它从控制器获取数据并显示在Jquery对话框中。我的目标是在对话框中有一个按钮,它允许点击数据,而不是用户使用鼠标突出显示数据并进行复制。如何将ajax成功结果复制到剪贴簿

阿贾克斯

function GrabLink(surveyName) { 
    $.ajax({ 
     type: "GET", 
     url: "/Survey/sendLink", 
     data: { test: surveyName }, 
     contentType: "application/json; charset=utf-8", 
     success: function (data) { 

      $('#my-dialog').html(data); 
      $("#my-dialog").dialog("open"); 

      //alert(data); 
      //$("#my-dialog").show(data); 
     } 
    }) 
} 

jQuery的对话框

$('#my-dialog').dialog({ 
    autoOpen: false, 
    width: 400, 
    resizable: false, 
    modal: true, 
    buttons: { 
     'Copy': function() 
     { 
      //window.prompt("Copy to clipboard: Ctrl+C, Enter", text); 
      // $(this).dialog('close'); 

     } 

    } 
}); 
+0

看一看[剪贴板。 JS](https://clipboardjs.com/)。 –

+0

我的解决方案答案能解决您的问题吗? –

+1

是的,它确实将其标记为有效答案 – cedPound

回答

1

您可以在剪贴板使用execCommand的副本javascript。创建输入时间,把里面的数据,将其取下:

function clipboard(){ 
    var mydata = document.createElement("input"); 
    document.body.appendChild(mydata); 
    mydata.setAttribute("id", "mydata_id"); 
    document.getElementById("mydata_id").value=Yourdata-success-response; 
    mydata.select(); 
    document.execCommand("copy"); 
    document.body.removeChild(mydata); 
} 
-1

尝试下面的代码,拷贝数据,而文本的选择/数据

<head> 
 
    <script type="text/javascript"> 
 
     function CopyToClipboard() { 
 
      var input = document.getElementById ("toClipboard"); 
 
      var textToClipboard = input.value; 
 
      
 
      var success = true; 
 
      if (window.clipboardData) { // Internet Explorer 
 
       window.clipboardData.setData ("Text", textToClipboard); 
 
      } 
 
      else { 
 
        // create a temporary element for the execCommand method 
 
       var forExecElement = CreateElementForExecCommand (textToClipboard); 
 

 
         /* Select the contents of the element 
 
          (the execCommand for 'copy' method works on the selection) */ 
 
       SelectContent (forExecElement); 
 

 
       var supported = true; 
 

 
        // UniversalXPConnect privilege is required for clipboard access in Firefox 
 
       try { 
 
        if (window.netscape && netscape.security) { 
 
         netscape.security.PrivilegeManager.enablePrivilege ("UniversalXPConnect"); 
 
        } 
 

 
         // Copy the selected content to the clipboard 
 
         // Works in Firefox and in Safari before version 5 
 
        success = document.execCommand ("copy", false, null); 
 
       } 
 
       catch (e) { 
 
        success = false; 
 
       } 
 
       
 
        // remove the temporary element 
 
       document.body.removeChild (forExecElement); 
 
      } 
 

 
      if (success) { 
 
       alert ("The text is on the clipboard, try to paste it!"); 
 
      } 
 
      else { 
 
       alert ("Your browser doesn't allow clipboard access!"); 
 
      } 
 
     } 
 

 
     function CreateElementForExecCommand (textToClipboard) { 
 
      var forExecElement = document.createElement ("div"); 
 
       // place outside the visible area 
 
      forExecElement.style.position = "absolute"; 
 
      forExecElement.style.left = "-10000px"; 
 
      forExecElement.style.top = "-10000px"; 
 
       // write the necessary text into the element and append to the document 
 
      forExecElement.textContent = textToClipboard; 
 
      document.body.appendChild (forExecElement); 
 
       // the contentEditable mode is necessary for the execCommand method in Firefox 
 
      forExecElement.contentEditable = true; 
 

 
      return forExecElement; 
 
     } 
 

 
     function SelectContent (element) { 
 
       // first create a range 
 
      var rangeToSelect = document.createRange(); 
 
      rangeToSelect.selectNodeContents (element); 
 

 
       // select the contents 
 
      var selection = window.getSelection(); 
 
      selection.removeAllRanges(); 
 
      selection.addRange (rangeToSelect); 
 
     } 
 
    </script> 
 
</head> 
 
<body> 
 
    <input id="toClipboard" value="text to clipboard"/> 
 
    <button onclick='CopyToClipboard()'>Copy text to clipboard</button> 
 
</body