我想使用JavaScript将文本从网页复制到剪贴板,但是.select()在Chrome(版本63)中不起作用。
代码如下:
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
function preventDefault(event)
{
event.preventDefault();
var copyText = document.getElementById("MainContent_txtClientDetailsName");
copyText.select();
document.execCommand("Copy");
return false;
}
</script>
<p id="nameTag">Name: </p>
<asp:Label ID="lblClientDetailsName" runat="server" autopostback="false"></asp:Label>
<asp:TextBox ID="txtClientDetailsName" runat="server" ReadOnly="true" Enabled="false">Testing</asp:TextBox>
<asp:LinkButton ID="btnCopyTitle" runat="server" OnClientClick="preventDefault(event)" CssClass="btn btn-default btn-xs">
<span class="glyphicon glyphicon-copy"></span>
</asp:LinkButton>
</asp:Content>
我已经在Edge中尝试过,它的工作非常完美。在线搜索建议调用copyText.focus(),但这也不起作用。
该代码基本上是https://www.w3schools.com/howto/howto_js_copy_clipboard.asp的w3schools指南的副本,可以在Chrome上正常运行。
您的代码很好,问题是当您在webform中禁用文本框时禁用文本框copyText.select();
无法正常工作删除这些属性ReadOnly="true" Enabled="false"
它可以正常使用现有代码如果您不想删除这些属性然后使用js方法下面它适合您。
<script>
function preventDefault(event) {
var copyText = document.getElementById("<%=txtClientDetailsName.ClientID%>");
$(copyText).removeAttr('ReadOnly Enabled disabled')
$(copyText).removeClass('aspNetDisabled')
copyText.select();
document.execCommand("Copy");
alert("Copied the text: " + copyText.value);
$(copyText).attr({
ReadOnly:"true",
disabled:"disabled",
})
$(copyText).addClass('aspNetDisabled')
event.preventDefault();
}
</script>
在chrome中我们有这个已知的问题,我们必须禁用onmouseup事件来保持选择。
function preventDefault(event)
{
event.preventDefault();
var copyText = document.getElementById("MainContent_txtClientDetailsName");
copyText.onmouseup = function(){return false};
copyText.select();
document.execCommand("copy");
return false;
}