移至下一个已禁用并启用onchange的输入
我有一个禁用元素,我只在输入值输入之前启用它,问题是change
在输入失去焦点之前触发并且焦点移动到下一个未禁用元素,因此删除disabled
属性则不行。
HTML:
Fill this before you continue: Fill this after the previous input:
jQuery的:
$('#a').change(function(){ if (this.value === "") $('#b').attr('disabled', 'disabled'); else $('#b').removeAttr('disabled'); });
小提琴
我通过从disabled
更改为readonly
来解决这个问题,但是它只是读取而不是禁用,因为我更喜欢,是否有良好且强大 (鼠标certificate)的方法来实现它并使用readonly
?
需要考虑的事项:
- 订阅多个事件似乎并不合适。
- 用户可以在不使用键盘的情况下将文本粘贴到第一个输入。
您在问题中已经说过您不想订阅多个事件,但这是我能想到的唯一方法。 问题是不同的方式直接使用C / C ++ DOM更改输入所有接口的值,但它们不通过JS API来实现。 有关详细信息,请参阅此问题 。
在订阅多个活动时,这样做的合理防弹方式是:
$('#a').on('keyup paste propertychange input', function() { if (this.value === "") $('#b').prop('disabled', true); else $('#b').removeAttr('disabled'); });
这是一个演示: http : //jsfiddle.net/HmzYR/
您是否考虑过在onkeydown
或onkeyup
上添加活动?
如果用户只需要输入内容,则可以在onkeyup
上添加一个执行validation的事件,并设置另一个输入元素的disabled属性。
我不确定事件的顺序,但是在重点移动之后onkeyup
也会发生。 但在这种情况下,这应该不是很大的问题。 我能想到的一个案例是以下一系列键: "a" backspace tab
。 我认为完美的解决方案是使用onkeydown
并在按下之前检查密钥,但是很难预测不可读密钥的效果,如backspace
和arrowdown
。
另一个建议:附加一个onkeydown
监听器并查找tab
键。 validation该值并启用下一个输入字段。
实质上:您需要捕获所有输入事件或所有更改焦点的事件(如tab
)。 而且你必须在事件完成之前采取行动。
使用prop
而不是attr
:
$('#b').prop('disabled', true);
也可以尝试连接到keyup
事件而不是change
事件。
这是一个小提琴: http : //jsfiddle.net/maniator/swubm/3/
有关更多说明,请参阅此处: .prop()vs .attr()
使用mouseout
处理切割和粘贴的小提琴: http : //jsfiddle.net/maniator/swubm/4/ (根据下面的评论)
我更新了我的答案: http : //jsfiddle.net/swubm/10/
Fill this before you continue:
Fill this after the previous input
JS:
$('#a').bind('input propertychange', function() { var value = $('#a').val(); if (value == "") $('#b').attr('disabled', 'disabled'); else $('#b').removeAttr('disabled'); });