使用 JS 或 Jquery - 是否有可能有一个只读字段显示带有掩码，但复制时没有掩码值？答案

【问题标题】：With JS or Jquery - Is it possible to have a read only field that displays with a mask, but unmasked value when copied?使用 JS 或 Jquery - 是否有可能有一个只读字段显示带有掩码，但复制时没有掩码值？
【发布时间】：2013-07-10 19:45:15
【问题描述】：

我有一个包含 2 个文本框的代码生成器表单。第一个采用 12 位代码，然后当按下按钮时，通过算法运行该代码并吐出 12 位密钥。我希望（实际上对于两个字段）使用掩码输入数据，但如果选择并复制，则为一串数字。

例如：

用户在文本框中输入：123456789012 掩码将框中的输入显示为：1234-5678-9012 用户按下生成按钮第二个文本框中的文本（只读）显示返回码为：5798-1521-4886 当用户复制第二个文本框并将其粘贴到记事本中时，值为：579815214886

这可能吗？我浏览了一些 JQuery 掩码插件，但它们都复制/粘贴了仍在字符串中的掩码数据。我唯一能想到的另一件事是，当一个字段获得焦点以移除遮罩时，但当它失去焦点以应用遮罩时。有没有更好的办法？

感谢您的帮助。

【问题讨论】：

您可以将“复制”和“粘贴”事件绑定到输入。
@gustavodidomenico 没关系。在copy 事件发生时，文本已被复制，您无法更改它。而paste与此无关
只是不同意你的观点。

标签： javascript jquery html forms input-mask

【解决方案1】：

我通过在提交表单时移除掩码解决了这个问题。获得焦点时移除遮罩，失去焦点时应用遮罩。

【讨论】：

【解决方案2】：

其实我只是访问IE浏览器。

首先是一个简单的输入框：

<input type="text" id="field" />

其次，绑定一个复制事件（在以后的jQuery版本中使用on代替bind）：

$(function() {
    $("#field").bind("copy", function (e) { window.clipboardData.setData("Text", "MyCustomText"); });
});

当您复制输入中的文本时，“MyCustomText”将被放入剪贴板数据中。您可以将其替换为不带掩码的字段所需的值。

【讨论】：

刚刚试用了那段代码。我使用的是最新的 jQuery，所以我将“bind”更改为“on”，将“#field”更改为“#overrideCode”，并尝试将“MyCustomText”的硬编码值设置为“blahblahblah”。如果我理解你的话，我应该能够从 id="overrideCode" 的文本框中复制值，并且它应该使用 "blahblahblah" 的值粘贴。到目前为止，我还没有得到这样的结果。
您在使用 Internet Explorer 吗？