「如果」條件JQuery的 - 驗證空字段

我正在測試由我自己的兩個領域驗證。當他們空了，我想顯示一條消息。「如果」條件JQuery的 - 驗證空字段

問題是「如果」條件沒有正確執行，我不知道爲什麼。

這是HTML代碼：

<div id="switchingform"> 
      <label for="currentsupplier">Who is your current supplier?</label> 
      <input type="text" name="currentsupplier" id="currentsupplier"/><br /> 
      <span class="validateText" id="validateSupplier"><p>Please enter your  current supplier</p></span> 

      <label for="postcode">What is your post code?</label> 
      <input type="text" name="postcode" id="postcode"/><br /> 
      <span class="validateText" id="validatePostCode"><p>Please enter your post code</p></span> 
</div>

這是jQuery代碼：

$("#telecomBusNext").click(function(){ 
    if($("#currentsupplier").val().length < 1 || $("#postcode").val().length < 1) { 
     $("#validateSupplier").fadeIn(400); 
     $("#validatePostCode").fadeIn(400); 
     return false; 
    } else if($("#currentsupplier").val().length > 1 || $("#postcode").val().length < 1) { 
     $("#validatePostCode").fadeIn(400); 
     $("#validateSupplier").fadeOut(400); 
     return false; 
    } else if($("#currentsupplier").val().length < 1 || $("#postcode").val().length > 1) { 
     $("#validatePostCode").fadeOut(400); 
     $("#validateSupplier").fadeIn(400); 
     return false; 
    } else { 
     $("#validateSupplier").fadeOut(400); 
     $("#validatePostCode").fadeOut(400); 
    } 
});

在此先感謝。

來源

2014-01-06 laluk

你能定義'不工作'嗎？ –

用'&&'更改'||'，它應該可以工作。你在兩個不同的條件中定義了兩個相同的條件。你的邏輯是錯誤的。 –

你顯然不明白'||'和'&&'之間的區別。這對程序員來說是一個非常基本的誤解。 – Barmar

更改||與&&它應該工作。你在兩個不同的條件中定義了兩個相同的條件。你的邏輯是錯誤的。

$("#telecomBusNext").click(function(){ 
    //THIS------------------------------------> <--ALSO HERE -----------------> 
    if($("#currentsupplier").val().length < 1 || $("#postcode").val().length < 1) { 
     $("#validateSupplier").fadeIn(400); 
     $("#validatePostCode").fadeIn(400); 
     return false;        //<--AND HERE is the same-----> 
    } else if($("#currentsupplier").val().length > 1 || $("#postcode").val().length < 1) { 
     $("#validatePostCode").fadeIn(400); 
     $("#validateSupplier").fadeOut(400); 
     return false; 
    //AND THIS are the same when using || ----------> 
    } else if($("#currentsupplier").val().length < 1 || $("#postcode").val().length > 1) { 
     $("#validatePostCode").fadeOut(400); 
     $("#validateSupplier").fadeIn(400); 
     return false; 
    } else { 
     $("#validateSupplier").fadeOut(400); 
     $("#validatePostCode").fadeOut(400); 
    } 
});

因爲這兩個條件語句包括$("#currentsupplier").val().length < 1並在這裏情況下，兩個包括$("#postcode").val().length < 1，如果這些條件之一爲真Jquery的不知道哪兩個操作上面標應該運行。

編輯：

這裏是我創建的JSFiddle。

讓我知道，如果這是你所需要的。

來源

2014-01-06 12:29:44

謝謝Stefanos，我犯了這個錯誤，你向我解釋得很好。但是現在當我改變||時與&&在wordpress中不起作用。爲什麼？ – laluk

你可以告訴我們你點擊了什麼'＃telecomBusNext'元素，也許我會做一個小提示，告訴你如何去做。 –

是的。這是一個簡單的提交按鈕。當你點擊它時，你進行提交併轉到下一頁。下面是代碼： <鈕標題=「繼續」名稱=「提交按鈕」類型=「提交」類=「BTN」 ID =「telecomBusNext」>繼續的事情是，符號辛博爾doesn't在Wordpress中正常工作，我不知道爲什麼。我寫$$（兩個＆符號），但它變爲& & – laluk

與您的代碼有關的問題是，當您應該使用&&（AND）`時，您正在使用||（OR）`。

但爲什麼通過檢查所有的組合來使它變得如此複雜？分開檢查兩個字段，它會容易得多：

$("#telecomBusNext").click(function(){ 
    var supplierValid = $("#currentsupplier").val().length > 0; 
    var postcodeValid = $("#postcode").val().length > 0; 
    $("#validateSupplier").fadeToggle(!supplierValid); 
    $("#validatePostCode").fadeToggle(!postcodeValid); 
    return supplierValid && postcodeValid; 
});

來源

2014-01-06 12:29:53 Barmar

感謝Barmar，但用你的方式......「返回假」會發生什麼。 – laluk

哎呀，錯過了。查看更新的答案。 – Barmar

你知道爲什麼在Wordpress中，＆符simbol不起作用嗎？我正在尋找一個解決方案，但我沒有發現任何關於... – laluk

「如果」條件JQuery的 - 驗證空字段

回答

相關問題