模糊事件不適用於下拉菜單

Question

我有這個小腳本，可以在啟用提交按鈕之前檢查表單是否有效：

$('#RegisterForm input').on('keyup blur', function () { 
    if ($('#RegisterForm').valid()) 
    {                   
        EnableSubmitButton();
    } 
    else
    {
        DisableSubmitButton();
    }
});

這工作完美，除了下拉菜單。 如果它們是要完成的最后一項，則這樣做不會觸發EnableSubmitButton()方法。 與其他輸入不同，如果您取消選擇它（或者，在文本框的情況下，清除內容）然后DisableSubmitButton(); 事件不觸發。

但是，如果您嘗試在未選擇下拉列表的情況下提交表單，它將觸發 $("#RegisterForm").validate() 方法中的Required錯誤。

<select 
    class="form-control input-sm required error" 
    id="CountryId" 
    name="CountryId" 
    aria-required="true" 
    aria-invalid="true">
        <option value="">Country*</option>
        <option value="1">United States</option>
        ....
</select>

Answer 1

您的原始選擇器僅匹配<input>類型的元素，其中不包括<select> 。

您可以修改選擇器以包含兩種元素類型：

$('#RegisterForm input, #RegisterForm select')...

Answer 2

我從這個改變了腳本：

$('#RegisterForm input').on('keyup blur', function () { 

對此：

$('#RegisterForm input').on('keyup blur change', function () { 

這仍然不起作用。 但是，這確實有效：

    // and for some reason, this dropdown isn't getting captured in the method above, so it gets it's own
    $("#CountryId").change(function () {
        if ($('#RegisterForm').valid()) {
            EnableSubmitBUtton();
        } else {
            DisableSubmitButton();
        }
    });

看起來像一個愚蠢的黑客，但它完成了工作。 打開其他答案。

Answer 3

下拉列表應該在表單字段內。然后模糊事件將起作用。