javascript - 防止选择输入文本字段

Question

出于以下考虑，我试图阻止在输入字段上进行选择

• 防止使用鼠标选择
• 防止使用键盘选择(包括 Ctrl+A、shift+箭头)
• 允许使用键盘和鼠标聚焦到现场

到目前为止我已经尝试过这些东西:

CSS

我尝试使用下面的类

.unselectable {
  -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

结果:仍然可以选择

我也试过以下没有成功:

$("#my_field").attr('unselectable','on')
     .css({'-moz-user-select':'-moz-none',
           '-moz-user-select':'none',
           '-o-user-select':'none',
           '-khtml-user-select':'none', 
           '-webkit-user-select':'none',
           '-ms-user-select':'none',
           'user-select':'none'
     }).bind('selectstart', function(){ return false; });

Javascript

我试过下面的

$( "#my_field" ).select(function(e) {
        console.log("Select called");
        e.preventDefault();
});

结果:控制台打印了消息，但是选择仍然有效

谢谢你的帮助

Answer 1

这可以通过在 select 上将元素的 selectionStart 设置为 selectionEnd 来完成。事件:

var inp = document.getElementById('my_input');

inp.addEventListener('select', function() {
  this.selectionStart = this.selectionEnd;
}, false);

<input id="my_input" type="text" value="Try to select me!" />