0

我有一个禁用的元素，只有在将值输入到它的先前输入后才启用它，问题是change在输入失去焦点之前触发并且焦点移动到下一个未禁用的元素，因此删除该disabled属性是不好的。

HTML：

Fill this before you continue:      <input id="a" />
Fill this after the previous input: <input id="b" disabled="disabled" />​

jQuery：

$('#a').change(function(){
    if (this.value === "")
        $('#b').attr('disabled', 'disabled');
    else
        $('#b').removeAttr('disabled');
});​

小提琴

我设法通过更改 from disabledto来克服这个问题，readonly但是它是只读的，而不是我喜欢的禁用，是否有好的和强大的（鼠标证明）方法来实现它和使用readonly？

需要考虑的事项：

  • 订阅多个事件似乎并不正确。
  • 用户可以在不使用键盘的情况下将文本粘贴到第一个输入。
4

4 回答 4

2

您在问题中说过您不想订阅多个事件，但这是我能想到的唯一方法。问题是改变输入值的不同方式都直接与 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/

于 2013-01-02T18:12:05.477 回答
1

您是否考虑在onkeydownor上添加事件onkeyup？

如果用户只需要输入一些内容，您可以添加一个事件来进行onkeyup验证并设置另一个输入元素的 disabled 属性。

我不确定事件的顺序，但onkeyup我假设焦点移动后也会触发。但在这种情况下，这应该不是什么大问题。我能想到的一种情况是以下键序列："a" backspace tab. 我想完美的解决方案是onkeydown在按下之前使用和检查键，但是很难预测不可读键的影响，比如backspaceand arrowdown。

另一个建议：附加一个onkeydown监听器并寻找tab关键。验证值并启用下一个输入字段。

本质上：您要么需要捕获所有输入事件，要么需要捕获所有改变焦点的事件（如tab）。你必须在事件完成之前采取行动。

于 2013-01-02T17:20:53.367 回答
0

使用prop而不是attr：

$('#b').prop('disabled', true);

也尝试挂钩到keyup事件而不是change事件。

这是一个小提琴：http: //jsfiddle.net/maniator/swubm/3/

有关更多解释，请参见此处：.prop() 与 .attr()

小提琴使用以下方法处理剪切和粘贴：http mouseout: //jsfiddle.net/maniator/swubm/4/（基于以下评论）

于 2013-01-02T17:16:17.383 回答
-2

我更新了我的答案：http: //jsfiddle.net/swubm/10/

Fill this before you continue:
<input id="a" />
<br>
<br>
Fill this after the previous input
<input id="b" disabled />​

JS：

$('#a').bind('input propertychange', function() {
    var value = $('#a').val();
    if (value == "")
        $('#b').attr('disabled', 'disabled');
    else
        $('#b').removeAttr('disabled');

});
于 2013-01-02T17:55:18.140 回答