Question

我正在尝试设置一个页面，其中包含按钮列表，列表（签名，返回，查询等）。目前，文本内置于textarea功能，请参阅：

<td>
  <b>PartSelect</b>
  <br />
  <textarea id="copyTarget" 
            cols="25"
            rows="3">Customer Service&#10;www.partselect.com&#10;888-895-1535
  </textarea>
  <br />
  <button id="copyButton">Copy</button>
</td>

一旦我弄清楚了这部分代码，我将从MySQL数据库中提取textarea值，但我可以做到。现在，我正在尝试使用隐藏文本区域的style:hidden;，但丢失了复制功能。 Javascript函数代码如下：

document.getElementById("copyButton").addEventListener("click", function() {
  copyToClipboardMsg(document.getElementById("copyTarget"), "msg");
});

正如我所说，当字段可见时，这可以正常工作，但是当我隐藏textarea时停止工作。有解决方案吗？

作为参考，如果需要，MySQL中的表使用以下信息：

数据库和表格名称为templates，列数为id category shortname longname text

Answer 1

试试这个：

$(document).ready(function(){

    $msg = "";

    $("#copyButton").on("click",function(){

        $msg = $("#copyTarget").text();
        $("#copyTarget").text("");
        $(this).prop({disabled:true});
        $("#pasteButton").removeAttr("disabled");

    })

    $("#pasteButton").on("click",function(){

         $("#pasteTxt").val($msg);
         $(this).prop({disabled:true});
         $("#copyButton").removeAttr("disabled");
        $msg = "";

    })

})

最终代码：

<html>
    <title>This is test</title>
    <head>
    </head>
    <body>
        <td>
             <b>PartSelect</b><br />
              <textarea id="copyTarget" cols="25" rows="3">Customer Service&#10;www.partselect.com&#10;888-895-1535</textarea>
            
              <br />
            
              <button id="copyButton">Copy</button>
              <button id="pasteButton" disabled>Paste</button>
            <br><br>
             <input type="text" id="pasteTxt" size="50">
        </td>
        
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script>
    $(document).ready(function(){

        $msg = "";

        $("#copyButton").on("click",function(){

            $msg = $("#copyTarget").text();
            $("#copyTarget").text("");
            $(this).prop({disabled:true});
            $("#pasteButton").removeAttr("disabled");

        })

        $("#pasteButton").on("click",function(){

             $("#pasteTxt").val($msg);
             $(this).prop({disabled:true});
             $("#copyButton").removeAttr("disabled");
            $msg = "";

        })

    })
        </script>
    </body>
</html>

隐藏的TextArea复制到Clickboard

1 个答案: