JS 实现复制、全选文本

 

先上效果，由于截图，高亮蓝色成了灰色　　　　参考这位大佬的   https://www.cnblogs.com/dreambin/p/9046999.html

HTML 部分

<form name=test>　　
    <input type="button" id="cardList" value="点此全选复制" onclick="javascript:selectAll('test.select1')">

    <textarea name="select1" rows=3 cols=46 onclick="selectAll('test.select1')">可以全选</textarea>
</form>

 

javaScript 部分

//实现全选功能
    function selectAll(theField) {

        var tempval = eval("document." + theField)  //这里主要是要得到dom  document.test.select1

        tempval.select()    // 选取文本域的内容

        this.copy(tempval.value)
    }


    //实现复制功能
    /*
        Evevt.clipboardData 对象

        clipboardData是JavaScript剪切板对象，该对象提供了3个常用方法：

    　　clearData():  clipboardData对象从剪切板删除一种或多种数据格式（一个参数：数据类型）

    　　getData():  clipboardData对象从剪切板获取指定格式的数据（一个参数：数据类型）

    　　setData():  clipboardData对象赋予指定格式的数据（两个参数：数据类型，要赋予的值）

    　　*数据类型一般为“"text/plain" ”
    */
    function copy(str) {
        var save = function (e) {
            e.clipboardData.setData('text/plain', str); //clipboardData对象
            e.preventDefault(); //阻止默认行为
        }
        document.addEventListener('copy', save);    
        document.execCommand("copy"); //使文档处于可编辑状态，否则无效
    }

    document.getElementById('cardList').addEventListener('click', function (ev) {
        copy(ev.target.innerText)
    })

    selectAll('test.select1')