如何對幾個輸入一起做一個if參數？

Question

我一直試圖做一個if參數，它將檢查幾個輸入（具有相同類）是否在幾個輸入上具有負數。 如果其中之一有，我想收到一條錯誤消息。 我一直在嘗試這樣做，盡管我寫了return和event.preventDefault，但我得到了我想要的錯誤消息，但該錯誤消息仍繼續進行下一步。 我的小提琴

我的代碼如下：

$("#inventoryForm").submit(function (event) {
          $(".inventoryInput").each(function(){
            if($(this).val() < 0) {
            event.preventDefault();
            $("#inventoryError").slideDown().text("blablabla");
            ;
            return;
            }
        });
});

Answer 1

您的問題來自其余代碼。 event.preventDefault()不會從提交處理程序中返回，只會阻止默認的表單提交行為。

您可以執行以下操作：

$("#inventoryForm").submit(function (event) {
       var error = false;

       //You seem to always want to prevent the default behavior
       event.preventDefault();

          $(".inventoryInput").each(function(){
            if($(this).val() < 0) {

                error = true; //Indicate there was an error
                $("#inventoryError").slideDown().text("blablabla");
                return false; //This stops the iteration
            }

        });

        //Stop processing if there was an error
        if (error) return;

        $("#inventorySubmit").hide();
        $("#inventoryChange").show();
        $("#withdraw").show();
        $(".inventoryInput").attr('disabled','disabled');
        sum = 0;
         /* var money = table.find("td:nth-child(2)");
        for (var i = 0; i<money.length; i++) {

        }
        */
    });

順便說一句，沒有jQuery的代碼更加簡潔：

var inputs = [].slice.call(document.querySelectorAll('.inventoryInput'));

if (inputs.some(haveValueUnderZero)) {
    //error
}

function haveValueUnderZero(input) { return input.value < 0; }

Answer 2

嘗試這個：

$("#inventoryForm").submit(function (event) {
    event.preventDefault();
    $(".inventoryInput").each(function () {
        if ($(this).val() < 0) {
            $("#inventoryError").slideDown().text("blablabla");
            return false;
        } else {
            $("#inventorySubmit").hide();
            $("#withdraw").show();
            return true;
        }
    });
});

另外，您需要插入其他函數，例如$("#withdraw").show(); 在else語句中。

JSFiddle演示

Answer 3

嘗試這個：

<script>
      $(".inventoryInput").each(function(){
             var el = $(this)
            $("#inventoryForm").on("submit", function (event) {
            if(el.val() < 0) {

                $("#inventoryError").slideDown().text("blablabla");
                return false;
        }

    })
});

Answer 4

嘗試隱藏驗證功能：

 window.verify = function() { var valid = true; $('input').each(function() { if ($(this).val() == "" || $(this).val() < 0) { valid = false; } }); if (valid) { $('#submit').click(); } else { alert("Please complete all fields."); } } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form id="inventoryForm"> <input type="text" placeholder="Product Id" name="prod_id" id="prod_id" /> <input type="number" placeholder="Quantity" name="quantity" id="quantity" /> <button type="button" onclick="verify()">Submit</button> <button id="submit" type="submit" style="display:none"></button> </form> 

Answer 5

您可以使用filter功能僅返回不符合您的條件的元素。

var hasErrorElements = $('.inventoryInput').filter(function() {
    return parseInt($(this).val()) < 0;
}).length > 0;

if (hasErrorElements) {
    alert('Error!');
    event.preventDefault();
    return false;
}