移至下一个已禁用并启用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/

您是否考虑过在onkeydownonkeyup上添加活动?

如果用户只需要输入内容,则可以在onkeyup上添加一个执行validation的事件,并设置另一个输入元素的disabled属性。

我不确定事件的顺序,但是在重点移动之后onkeyup也会发生。 但在这种情况下,这应该不是很大的问题。 我能想到的一个案例是以下一系列键: "a" backspace tab 。 我认为完美的解决方案是使用onkeydown并在按下之前检查密钥,但是很难预测不可读密钥的效果,如backspacearrowdown


另一个建议:附加一个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'); });