How can I make Jquery to check multiple values?

问题

The Jquery code below works very well and checks for input values based on conditions .. But for the ESNList text field in the HTML form , many ESNs(numbers) can be entered and separated by a comma in the same text field , how can I make so Jquery makes sure that all the numbers entered on the same text field still match the condition for ESNList , your help would be greatly appreciated ..

 <html>
    <head>
    <script type="text/javascript" src="jquery/jquery-1.8.3.js"></script>
    <script type="text/javascript">

    $(function () {


    $(":text").css("border", "2px solid red");
      $(":text").keyup(function(){
        var enteredData = $(this).val()
        console.log(enteredData);
        if (enteredData == "") {
          $(this).css("border", "2px solid red");
        } else {
          $(this).css("border", "inherit");
        }
        if ($(this).attr("id") == "ESNList"){
          esnList = parseInt(enteredData);
          switch (true){
            case ( esnList >= 986329 && esnList <= 999999):
                $("#ddl_StxName").val("stx2");
                $("#ddl_rtumodel").val("globalstar");
                break;
            case ( esnList >= 660000 && esnList <= 699999):
                $("#ddl_StxName").val("mmt");
                $("#ddl_rtumodel").val("globalstar");
                break;
            case ( esnList >= 200000 && esnList <= 299999):
                $("#ddl_StxName").val("stm3");
                $("#ddl_rtumodel").val("stmcomtech");
                break;
            case ( esnList >= 1202114 && esnList <= 1299999):
                $("#ddl_StxName").val("smartone");
                $("#ddl_rtumodel").val("globalstar");
                break;
          }

        }
      });
      });
    </script> </head>
    <body>
    <form id="provision">
        ESNList:    <input  type="text" id="ESNList" name="ESNList" size="30" /> <br />
        ESN Start:<input type="text" id="ESNStart" name="ESNStart" size="10" /> <br />
        ESN End: <input type="text" id="ESNStart" name="ESNStart" size="10" /> <br />
        UnitName:<input type="text" id="STxName" name="STxName" size="30"  />  <br />  
         Unit Model:   <select name="STxName" id="ddl_StxName">
        <option value="stx2">STX2</option>
        <option value="stm3" selected>STM3</option>
        <option value="acutec">Acutec</option>
         <option value="trackpack">Trackpack</option>
        <option value="mmt">MMT</option>
        <option value="smartone">Smartone</option>
        <option value="smartoneb" >SmartOneB</option>
        </select> <br />
        RTU Model Type:
         <select name="rtumodel" id ="ddl_rtumodel">
        <option value="globalstar">GlobalStar</option>
        <option value="both">Both</option>
        <option value="comtech">Comtech</option>
        <option value="stmcomtech">STMComtech</option>
        </select> <br />
        <input type="submit" value ="submit"  />
        </form>
    </body>
    </html>

回答1:

You can split the list by a comma delimiter and validate each individual element.

$.each(enteredData.split(","), function(i, str){
    var esnList = +str;
    /* enter validation here */
});

回答2:

Expecting clean, well-formed data from a user in an input field is optimistic - even with visual instructions.

Without going into security and sanitation lets assume the user has put in a well formed comma separated list:

153, 189, 635

You will need to write a function that takes the input value of the input element and then do a split() on the variable. This will give you an array which you can loop over to check the value against your criteria.

回答3:

Instead of using parseInt() directly on enteredData you would first use

esnList = enteredData.split(',');

and then you can go over that array with a loop, using parseInt() and performing your checks or use the map function of your favorite JS library for that like Alexander did.

Plain JS:

for(var i = 0; i < esnList.length; i++) {
    ... // parseInt(esnList[i]) and perform checks
}

jQuery:

$.each(esnList, function(i, esn) {
    ... // parseInt(esn) and perform checks
});

来源：https://stackoverflow.com/questions/14593480/how-can-i-make-jquery-to-check-multiple-values

标签

jquery

jquery-ui

javascript-events

javascript