if/else else if in Jquery 条件

Question

I am having a set of text fields where i am doing validation Say I am Having a field called "seats" this can accept value less than "99999".Meaning I should not able to enter the "99999" any thing less than that is ok. For that I wrote below if and else if. please tell me whether I am doing any thing wrong. I am confused a lot from morning whether it should be less than or greater than

if ($("#seats").val() != '') {
    setflag = false;
    alert("Not a valid character")
}
else if($("#seats").val() < 99999) {
    alert("Not a valid Number");
} else {
    setflag = true;
}

Answer 1

Iam confused a lot from morning whether it should be less than or greater than`

this can accept value less than "99999"

I think you answered it yourself... But it's valid when it's less than . Thus the following is incorrect:

}elseif($("#seats").val() < 99999){
  alert("Not a valid Number");
}else{

You are saying if it's less than 99999, then it's not valid . You want to do the opposite:

}elseif($("#seats").val() >= 99999){
  alert("Not a valid Number");
}else{

Also, since you have $("#seats") twice, jQuery has to search the DOM twice. You should really be storing the value, or at least the DOM element in a variable. And some more of your code doesn't make much sense, so I'm going to make some assumptions and put it all together:

var seats = $("#seats").val();

var error = null;

if (seats == "") {
    error = "Number is required";
} else {
    var seatsNum = parseInt(seats);
    
    if (isNaN(seatsNum)) {
        error = "Not a valid number";
    } else if (seatsNum >= 99999) {
        error = "Number must be less than 99999";
    }
}

if (error != null) {
    alert(error);
} else {
    alert("Valid number");
}

// If you really need setflag:
var setflag = error != null;

Here's a working sample: http://jsfiddle.net/LUY8q/

Answer 2

A few more things in addition to the existing answers. Have a look at this:

var seatsValid = true;
// cache the selector
var seatsVal = $("#seats").val();
if(seatsVal!=''){
    seatsValid = false;
    alert("Not a valid character")
    // convert seatsVal to an integer for comparison
}else if(parseInt(seatsVal) < 99999){
    seatsValid = false;
    alert("Not a valid Number");
}

The variable name setFlag is very generic, if your only using it in conjunction with the number of seats you should rename it (I called it seatsValid). I also initialized it to true which gets rid of the need for the final else in your original code. Next, I put the selector and call to .val() in a variable. It's good practice to cache your selectors so jquery doesn't need to traverse the DOM more than it needs to. Lastly when comparing two values you should try to make sure they are the same type, in this case seatsVal is a string so in order to properly compare it to 99999 you should use parseInt() on it.

Answer 3

将小于运算符更改为大于或等于运算符：

}elseif($("#seats").val() >= 99999){

Answer 4

See this answer . val() is comparing a string , not a numeric value .

Answer 5

If statement for images in jquery:
#html

<button id="chain">Chain</button>
<img src="bulb_on.jpg" alt="img" id="img"/>

#script
    <script>
        $(document).ready(function(){
            $("#chain").click(function(){
            if($("#img").attr('src')!='bulb_on.jpg'){
                $("#img").attr('src', 'bulb_on.jpg');
            }
            else
            {
                $("#img").attr('src', 'bulb_onn.jpg');
            }
            });
        });
    </script>

Answer 6

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <form name="myform">
    Enter your name
    <input type="text" name="inputbox" id='textBox' value="" />
    <input type="button" name="button" class="member" value="Click1" />
    <input type="button" name="button" value="Click2" onClick="testResults()" />
  </form>
  <script>
    function testResults(n) {
      var answer = $("#textBox").val();
      if (answer == 2) {
        alert("Good !");
      } else if (answer == 3) {
        alert("very Good !");
      } else if (answer == 4) {
        alert("better !");
      } else if (answer == 5) {
        alert("best !");
      } else {
        alert('wrong');
      }
    }
    $(document).on('click', '.member', function () {
      var answer = $("#textBox").val();
      if (answer == 2) {
        alert("Good !");
      } else if (answer == 3) {
        alert("very Good !");
      } else if (answer == 4) {
        alert("better !");
      } else if (answer == 5) {
        alert("best !");
      } else {
        alert('wrong');
      }
    });
  </script>

Answer 7

And if you wanna make some if else with css attribute you can do it like this this program used to make highlight button for some text with jquery

  HTML :

 <,DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width. initial-scale=1.0" /> <title>Document</title> </head> <style>:myclass { background-color; yellow: font-weight; bold, } </style> <body> <h1>PTIK FKIP UNS</h1> The <span class="warna">Faculty of Teacher Training and Education</span>,<span class="warna">Sebelas Maret University</span>. Surakarta is an <span class="warna">Educational Personnel Education Institution (LPTK)</span> which has 24 study programs in 6 majors, Each study program has its own characteristics in producing <span class="warna">superior. strong and intelligent educational staff.</span> <br> <br> The <span class="warna">Informatics and Computer Technology Education (PTIK)</span> tudy program is planned to take shelter in the management of the <span class="warna">Engineering and Vocational Education (PTK)</span> department, This placement revises our previous statement. where the PTIK study program is under the P.MIPA department. PTIK is a study program that will produce graduates who are <span class="warna">prioritized to teach in vocational/vocational programs,</span> So, it would be better if PTIK was under the PTK department which oversees vocational programs such as<span class="warna">Building Engineering Education,</span>and <span class="warna">Mechanical Engineering Education </span>To meet the needs of lecturers in the field of information technology that cannot be met by the PTK department: PTIK will conduct <span class="warna">resource sharing with the mathematics study program</span> </div> <script src="https.//cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("#Highlight").click(function(){ if($(".warna").hasClass('myclass')){ $(".warna");removeClass('myclass'). } else { $(".warna");addClass('myclass'); } }); }); </script> <br><br> <button id="Highlight">Highlight Paragraf</button> </body> </body> </html>