Как включить перемещение курсора при использовании атрибута readonly в поле ввода в браузере Chrome

Как включить перемещение курсора при использовании атрибута readonly в поле ввода в браузере Chrome, отлично работает с firefox.Этот наблюдение за полным значением в поле ввода, которое не будет доступно для редактирования. Знание того факта, что это зависит от браузера функцию, любой другой способ переписать это?

2 ответа

Это действительно хорошая причина, по которой Chrome не позволяет курсору мигать в текстовом поле только для чтения, и это потому, что мигающий курсор указывает, что пользователь может ввести этот элемент управления.

Итак, сначала оцените его с точки зрения UX, если вы хотите пойти против этого принципа!

Если вы действительно это действительно делаете, вы можете подделать поведение только для чтения, используя собственный атрибут 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(); }
});

Вы можете взглянуть на скрипку здесь. http://jsfiddle.net/BUcC2/1/

Если вы хотите, чтобы это было нормальное управление вводом, которое должно вести себя стандартным образом, я бы рекомендовал не использовать этот метод и придерживаться интерпретации браузера наилучшего способа отображения html:)


Это невозможно в Google Chrome, так как вы не можете установить курсор для перемещения в поле ввода, когда он доступен только для чтения, но в IE и firefox это возможно.

licensed under cc by-sa 3.0 with attribution.