javascript - 如何在 Chrome 浏览器的输入字段中使用只读属性时启用光标移动

Question

如何在 chrome 浏览器的输入字段中使用只读属性时启用光标移动，与 firefox 一起工作。这是为了观察输入框中的完整值，该值将不可编辑。知道这是一个浏览器相关的事实功能，还有其他方法可以覆盖它吗？

Answer 1

Chrome 不让光标在只读文本框中闪烁是有充分理由的，因为闪烁的光标表示用户可以在该控件中键入内容。

因此，如果您想违背该原则，首先要从用户体验的 Angular 来决定是否值得!

如果你真的这样做，你可以通过使用自定义 data- 属性指定你希望输入是只读的，然后忽略任何非导航按键来伪造只读行为.

var allowedKeys = {
    "37" : "arrow-left",
    "38" : "arrow-up",    
    "39" : "arrow-right",    
    "40" : "arrow-down",
    "9" : "tab",    
    "27" : "esc"        
}

$("input[data-readonly=readonly]").keydown(function(e){
    console.log(e.which);
    if (!allowedKeys[e.which]) {
        e.preventDefault();
    }
});

您可以在此处查看 fiddle 。 http://jsfiddle.net/BUcC2/1/

如果您的意图是让它成为一个正常的输入控件，它应该以标准方式运行，我建议您不要使用此方法并坚持浏览器对显示 html 的最佳方式的解释:)