По-видимому, отключенное <input>
не обрабатывается никаким событием
Существует ли способ работать вокруг этой проблемы?
<input type="text" disabled="disabled" name="test" value="test" />
$(':input').click(function () {
$(this).removeAttr('disabled');
})
Здесь, я должен нажать на вход для включения его. Но если я не активирую его, вход не должен быть отправлен.
Отключенные элементы не запускают события мыши. Большинство браузеров распространяют событие, происходящее от отключенного элемента, вверх по дереву DOM, поэтому обработчики событий могут быть размещены на элементах контейнера. Однако Firefox не демонстрирует такого поведения, он просто ничего не делает, когда вы щелкаете отключенный элемент.
Я не могу придумать лучшего решения, но для полной кроссбраузерной совместимости вы можете поместить элемент перед отключенным вводом и поймать щелчок по этому элементу. Вот пример того, что я имею в виду:
<div style="display:inline-block; position:relative;">
<input type="text" disabled />
<div style="position:absolute; left:0; right:0; top:0; bottom:0;"></div>
</div>
jq:
$("div > div").click(function (evt) {
$(this).hide().prev("input[disabled]").prop("disabled", false).focus();
});
Пример: http://jsfiddle.net/RXqAm/170/ (обновлено для использования jQuery 1.7 с prop
вместо attr
).
Возможно, вы могли бы сделать поле только для чтения, а при отправке отключить все поля только для чтения
$(".myform").submit(function(e) {
$("input[readonly]", this).attr("disabled", true);
});
, а ввод (+ скрипт) должен быть
<input type="text" readonly="readonly" name="test" value="test" />
$('input[readonly]').click(function () {
$(this).removeAttr('readonly');
})