Jquery .validate行爲不正常（並不總是工作）

我想創建一個來自某個驗證。很簡單，有3個輸入字段，我想確保它們不是空的。Jquery .validate行爲不正常（並不總是工作）

總的來說，它似乎工作，但 - 我遇到了一個問題，我不知道如何解決。首先，展示它的外觀：（當然，我沒有足夠的代表張貼照片，希望有人不介意看鏈接。）

驗證前的樣子：（Urgh ，只有兩個鏈接）基本上相同，但沒有綠色邊框。

隨着有效輸入：http://i.gyazo.com/dd7b9aa274b01667abe1f86991caf5d9.png

現在的問題;如果我從第一個字段開始，然後進入下一個，然後是最後一個，但不輸出輸入，它將按照它應該通過的方式傳遞。但是如果我回到輸入字段2並刪除輸入（這意味着它是錯誤的），它仍然顯示爲有效。

它的外觀我已經做了之後前面：現在http://i.gyazo.com/c232594eaf9dea1625946a2c9275586f.png

，該代碼

的HTML：

<form id="modal-form"> 
    <div class="fieldcheck priceModelInput"> 
     <label>1 week</label> 
     <div class="input-group med-input"> 
     <input id="WeekOneInput" type="number" min="0" value="" /> 
     <span class="input-group-addon"> 
      <i class="icon-money"></i> 
     </span> 
     </div> 
    </div> 

    <div class="fieldcheck priceModelInput"> 
     <label>2 weeks</label> 
     <div class="input-group med-input"> 
     <input id="WeekTwoInput" type="number" min="0" value="" /> 
     <span class="input-group-addon"> 
      <i class="icon-money"></i> 
     </span> 
     </div> 
    </div> 

    <div class="fieldcheck priceModelInput"> 
     <label>Per Day</label> 
     <div class="input-group med-input"> 
     <input id="DayInput" type="number" min="0" value="" /> 
     <span class="input-group-addon"> 
      <i class="icon-money"></i> 
     </span> 
     </div> 
    </div> 
</form>

腳本：

$('#modal-form').validate({ 
    rules: { 
     WeekOneInput: { 
     minlength: 1, 
     required: true 
     }, 
     WeekTwoInput: { 
     minlength: 1, 
     required: true 
     }, 
     DayInput: { 
     minlength: 1, 
     required: true 
     } 
    }, 
    errorPlacement: function (error, element) { 
     error.appendTo(element.parent()); 
    } 
}); 

//Tried this function to extra check it but without succes. 
$('#WeekOneInput, #WeekTwoInput, #DayInput').on('focusout', function() { 
    if ($(this).hasClass('valid')) $(this).valid(); 
});

所以..有沒有人有一個想法爲什麼是這樣的嗎？以及如何避免它？

親切的問候

無奈。

來源

2014-09-10 Naoness

你能用例子提供[fiddle]（http://jsfiddle.net）嗎？ – Regent 2014-09-10 09:06:38

哦，當然！在途中。 – Naoness 2014-09-10 09:16:06

http://jsfiddle.net/kvtqzp0s/，但我以前沒有真正使用過小提琴，所以它根本不起作用。可能是因爲我正在使用的項目是使用Bootstrap MVC。 – Naoness 2014-09-10 09:35:28

將name添加到input s部分解決了問題。實際上輸入正確的值，然後刪除它仍然會產生怪異的行爲（不顯示錯誤），但這種行爲甚至出現在docs。但至少在點擊submit期間對此進行驗證。

Updated fiddle。

<input id="WeekOneInput" name="WeekOneInput" type="number" min="0" value="" /> 

<input id="WeekTwoInput" name="WeekTwoInput" type="number" min="0" value="" /> 

<input id="DayInput" name="DayInput" type="number" min="0" value="" />

來源

2014-09-10 10:14:31 Regent

非常感謝！ – Naoness 2014-09-10 11:01:36

Jquery .validate行爲不正常（並不總是工作）

回答

相關問題