Jquery 使用文本输入禁用提交按钮，然后选择下拉菜单

我试图禁用提交按钮，直到所有字段都有值。它适用于电子邮件和密码输入，但不适用于选择下拉列表

我理解这是由于.keyup不适用于下拉列表，但不确定如何调整代码。我尝试过使用变更事件，但这完全禁用了提交按钮

<form>   
    <input class="disableButton" id="email" type="email" />         
    <input class="disableButton" id="pass" type="password" />
    <select id="state" class="selected-state disableButton">
        <option value="">State</option>
        <option value="AL">AL</option>
        <option value="AK">AK</option>
        ...
    </select>
    <input id="emailPassSubmit" type="button" disabled="disabled" />
</form>

<script>
$(function() {
    $('.disableButton').keyup(function() {
        if ($('#email').val() == '' || $('#pass').val() == '' ||  $('#state').val() == '') {
            $('#emailPassSubmit').prop('disabled', true);
        } else {
            $('#emailPassSubmit').prop('disabled', false);
        }
    });
});
</script>

您需要测试keyup和change事件，因为您希望在不同类型的元素上触发它

可以使用jQuery的方法将多个事件附加到元素，如下所示：

$('.disableButton').on('keyup change', function(){ ...

---

您忘记将disableButton类添加到select下拉列表中

以下是一个工作版本：

---

选择的答案是可行的，但它并不优雅或可伸缩。由于某些原因，每个字段都是硬编码的，即使您已经为每个必需的输入添加了一个类

相反，只需使用类“.disableButton”循环遍历每个项目：

$('.disableButton').on('keyup change', function() {
    var empty = false;
    $('.disableButton').each(function() {
        if ($(this).val() == '') {
            empty = true;
        }
    });

    if (empty) {
        $('#emailPassSubmit').prop('disabled', true);
    } else {
        $('#emailPassSubmit').prop('disabled', false);
    }
});

只要确保每个字段与文本输入一起工作，下拉列表等都有class disableButton。此外，下拉列表的默认值必须为，而您的下拉列表的默认值为

---

这样，在将来，您可以添加任意多的字段，只要您有正确的类，就不必再去碰这些代码。

就是这样！谢谢，空