Chrome 63中WebForms场景下JavaScript .select()方法失效求助

我帮你分析下问题所在，以及对应的解决方案：

问题根源 #

你的代码里给asp:TextBox同时设置了ReadOnly="true"和Enabled="false"，在Chrome 63及部分版本中，被禁用（disabled）的表单元素会被浏览器限制选择操作，所以copyText.select()无法生效；而Edge对禁用元素的选择逻辑更宽松，因此能正常工作。这也是为什么参考的示例能在Chrome正常运行——示例中的元素没有设置disabled属性。

解决方案 #

方案1：移除Enabled="false"，仅保留只读属性

如果不需要元素呈现“禁用”的视觉样式，只需要只读不可编辑，直接去掉Enabled="false"即可，这样元素处于只读但未禁用状态，Chrome就能正常执行select()：

<asp:TextBox ID="txtClientDetailsName" runat="server" ReadOnly="true">Testing</asp:TextBox>

方案2：用CSS模拟禁用样式，保留元素可选择

如果需要保持“禁用”的视觉效果，但又要让元素可选择，可以用CSS来模拟禁用外观，同时只保留ReadOnly="true"：

<asp:TextBox ID="txtClientDetailsName" runat="server" ReadOnly="true" CssClass="disabled-style">Testing</asp:TextBox>

添加对应的CSS样式：

.disabled-style {
  background-color: #eeeeee;
  color: #666666;
  cursor: not-allowed;
  border: 1px solid #cccccc;
}

方案3：创建临时文本区域复制内容（兼容性最优）

如果必须保留Enabled="false"，可以通过创建临时的textarea元素来复制目标值，绕过原元素的禁用限制，这种方法兼容性最好，适用于所有场景：
修改你的JavaScript函数：

function preventDefault(event) {
  event.preventDefault();
  var copyText = document.getElementById("MainContent_txtClientDetailsName");
  
  // 创建临时textarea元素
  const tempTextarea = document.createElement("textarea");
  // 将目标元素的值赋值给临时textarea
  tempTextarea.value = copyText.value;
  // 把临时元素添加到页面（设置为不可见）
  tempTextarea.style.position = "absolute";
  tempTextarea.style.left = "-9999px";
  document.body.appendChild(tempTextarea);
  
  // 选择并复制内容
  tempTextarea.select();
  document.execCommand("Copy");
  
  // 移除临时元素
  document.body.removeChild(tempTextarea);
  return false;
}

这种方法的核心是：把目标元素的内容转移到一个临时的、可编辑的文本区域中进行复制操作，完全不受原元素状态的影响。

内容的提问来源于stack exchange，提问作者Meitsrik