Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/32.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css 如何防止在输入字段中选择文本时突出显示文本_Css_Reactjs - Fatal编程技术网

Css 如何防止在输入字段中选择文本时突出显示文本

Css 如何防止在输入字段中选择文本时突出显示文本,css,reactjs,Css,Reactjs,我想复制输入字段中的文本,但不突出显示所选文本。下面是代码片段 click = () => { this.input_ref.current.select(); document.execCommand('copy'); }; <input readOnly ref={this.input_ref} value="hello"/> <button onClick={this.click}>COPY</button> click = (

我想复制输入字段中的文本,但不突出显示所选文本。下面是代码片段

click = () => {
    this.input_ref.current.select();
    document.execCommand('copy');
};

<input readOnly ref={this.input_ref} value="hello"/>
<button onClick={this.click}>COPY</button>
click = () => {
   this.input_ref.current.select();
   document.execCommand('copy');
   window.getSelection().removeAllRanges();
};
我已经尝试将css添加到输入字段,如下所示,但没有成功

.no_select {
-webkit-tap-highlight-color: transparent;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
outline: none;
}
<input classname="no_select" readOnly ref={this.input_ref} value="hello"/>

有人能帮我吗。谢谢。

我找到了我问题的答案,我想这也会帮助别人。所以在这里发布一个答案。 将文本复制到我使用的剪贴板后单击“复制”按钮 window.getSelection.removeAllRanges以取消选择输入字段中的文本。下面是代码片段

click = () => {
    this.input_ref.current.select();
    document.execCommand('copy');
};

<input readOnly ref={this.input_ref} value="hello"/>
<button onClick={this.click}>COPY</button>
click = () => {
   this.input_ref.current.select();
   document.execCommand('copy');
   window.getSelection().removeAllRanges();
};
编辑:以上仅适用于chrome,而不适用于IE11,因此使用了适用于chrome和IE11的以下行来取消选择输入字段中的文本

document.getSelection().removeAllRanges();
document.getSelection().addRange(document.createRange());

尝试此操作,或者简单地将输入设置为一个可能的副本,它仍然会突出显示输入字段中的文本