2015-11-22 30 views
11

我没有JavaScript的知识,但我设法把这个代码放在一起使用的比特和螺栓来自不同堆栈溢出 解答。它工作正常,并通过警报框输出文档中所有选定复选框的数组。JavaScript变量的副本输出到剪贴板

function getSelectedCheckboxes(chkboxName) { 
    var checkbx = []; 
    var chkboxes = document.getElementsByName(chkboxName); 
    var nr_chkboxes = chkboxes.length; 
    for(var i=0; i<nr_chkboxes; i++) { 
    if(chkboxes[i].type == 'checkbox' && chkboxes[i].checked == true) checkbx.push(chkboxes[i].value); 
    } 
    return checkbx; 
} 

,并呼吁它使用:

<button id="btn_test" type="button" >Check</button> 
<script> 
    document.getElementById('btn_test').onclick = function() { 
     var checkedBoxes = getSelectedCheckboxes("my_id"); 
     alert(checkedBoxes); 
    } 
</script> 

现在我想修改它,当我点击btn_test按钮输出数组checkbx被复制到剪贴板。我尝试添加:

checkbx = document.execCommand("copy"); 

checkbx.execCommand("copy"); 

在函数的末尾,然后调用它像:

<button id="btn_test" type="button" onclick="getSelectedCheckboxes('my_id')">Check</button> 

但它不工作。没有数据被复制到剪贴板。

+0

我怀疑你可以原始JS对象复制到剪贴板。 '.execCommand('copy')'复制页面上的选择(如果用户首选项允许)。您可以尝试对数组进行字符串化,然后使用它填充textarea,从textarea中选择全部,然后使用'execCommand'复制。粘贴时捕捉事件,并将内容解析回数组。 – Teemu

+0

行..感谢您指点我的方向。我认为这可能是不可能的,因为它似乎没有返回任何直接的搜索结果。所以我想我会尽力按照你的建议去做。 – harman

+0

这可能是一个愚蠢的问题,但你会在哪里/如何粘贴一个原始的JS对象? – Teemu

回答

13

OK,我发现了一些时间和Teemu遵循的建议,我能得到正是我想要的。

所以这里是任何人都可能感兴趣的最终代码。为了说明起见,这段代码获取了某个ID的所有复选框,并将它们输出到一个名为checkbx的数组中,然后将其唯一名称复制到剪贴板。

JavaScript函数:

function getSelectedCheckboxes(chkboxName) { 
    var checkbx = []; 
    var chkboxes = document.getElementsByName(chkboxName); 
    var nr_chkboxes = chkboxes.length; 
    for(var i=0; i<nr_chkboxes; i++) { 
    if(chkboxes[i].type == 'checkbox' && chkboxes[i].checked == true) checkbx.push(chkboxes[i].value); 
    } 
    checkbx.toString(); 

    // Create a dummy input to copy the string array inside it 
    var dummy = document.createElement("input"); 

    // Add it to the document 
    document.body.appendChild(dummy); 

    // Set its ID 
    dummy.setAttribute("id", "dummy_id"); 

    // Output the array into it 
    document.getElementById("dummy_id").value=checkbx; 

    // Select it 
    dummy.select(); 

    // Copy its contents 
    document.execCommand("copy"); 

    // Remove it as its not needed anymore 
    document.body.removeChild(dummy); 
} 

与其HTML电话:

<button id="btn_test" type="button" onclick="getSelectedCheckboxes('ID_of_chkbxs_selected')">Copy</button> 
+1

这是否可以在不创建HTML元素的情况下完成?举例来说,我只是想在点击按钮或预先指定的元素时将字符串复制到用户剪贴板中? – VikingGoat

+1

我建议使用“textarea”而不是“input”,这样你也可以复制换行符。 –

7

非常有用的。我修改它以将JavaScript变量值复制到剪贴板:

function copyToClipboard(val){ 
    var dummy = document.createElement("input"); 
    document.body.appendChild(dummy); 
    $(dummy).css('display','none'); 
    dummy.setAttribute("id", "dummy_id"); 
    document.getElementById("dummy_id").value=val; 
    dummy.select(); 
    document.execCommand("copy"); 
    document.body.removeChild(dummy); 
} 
8

lbrutti的答案是好的,但他写错了代码!

function copyToClipboard(text){ 
    var dummy = document.createElement("input"); 
    document.body.appendChild(dummy); 
    dummy.setAttribute('value', text); 
    dummy.select(); 
    document.execCommand("copy"); 
    document.body.removeChild(dummy); 
} 
copyToClipboard('Hello, World!') 
1

对于复制任何文本复制到剪贴板的一般用途,我写了下面的功能:

function textToClipboard (text) { 
    var dummy = document.createElement("textarea"); 
    document.body.appendChild(dummy); 
    dummy.value = text; 
    dummy.select(); 
    document.execCommand("copy"); 
    document.body.removeChild(dummy); 
} 

参数的值插入到一个新创建<textarea>值,然后将其选中后,其值将被复制到剪贴板,然后从文档中删除。