2015-11-22 28 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>值,然後將其選中後,其值將被複制到剪貼板,然後從文檔中刪除。