我有這個jQuery驗證功能問題。驗證僅適用於一次

Question

下面的功能正常工作。這是爲了驗證表單。總之，我有幾個輸入字段。如果我點擊提交併且任何一個輸入中都沒有輸入文字，則會出現驗證錯誤。如果我填寫一個字段，則只會更新一個字段。但如果我再次點擊「提交」，即使沒有填寫第二個表單輸入，else {}也會被解僱，而不是填寫的if {}。}

不熟悉，但它是一個返回false;問題？

if ($('input[type="text"]:visible').val().length == 0) { 
    $('.submitModal').click(function() { 
     $('.modal').modal('show'); 
    }); 
} 
else { 
    $('.submitModal').click(function() { 
     $('.modal').modal('hide'); 
    }); 
} 

任何想法我做錯了什麼？

Answer 1

這是倒退的想法。綁定點擊，句點。沒有條件。點擊後，決定你想要發生什麼（即使這隻意味着忽略點擊）。

如果你綁定了點擊，填寫表單的方式不會解除綁定。即使你實際上可以解除綁定，但沒有很好的理由。

如果.submitModal實際上是一個提交輸入元素（而不是具有該類的錨點或按鈕），而不是綁定一個點擊監聽器，那麼綁定一個提交監聽器。

基於代碼的邁克自己的起點，這裏有一個例子（略真實環境之外，因爲我沒有可用而不不必要的努力modal功能！）

$('.submitModal').click(function (e) { 
    e.preventDefault(); 
    $('input[type="text"]:visible').each(function() { 
     if ($(this).val().length == 0) {       
      $('.modal').show();       
     } 
     else { 
      $('.modal').hide(); 
     } 
    }); 
});​ 

這是不同的第一件事是我將事件傳遞到點擊處理程序，然後preventDefault就可以了。這可以防止錨點導致頁面刷新。

但我唯一做的其他事情是換出實際的.modal()調用通用jQuery .show()和.hide()只是爲了概念驗證的邏輯。 Mike，你寫的示例代碼非常棒（除了preventDefault，假設你確實想要阻止默認的錨定行爲）。這裏的證明：

jsfiddle.net/gnaXn/2

當所有可見的文本字段填寫的「莫代爾」皮等。當他們再次清空時，「模態」重新出現。