Jquery 中的 If/else else if 条件

问题描述 投票:0回答:8

我有一组文本字段,我正在其中进行验证 假设我有一个可以接受的名为“席位”的字段 值小于“99999”。这意味着我应该无法输入 “99999” 任何低于这个数字都可以。为此,我在下面写了 if 和 else if 。 请告诉我我是否做错了什么。从早上开始我就很困惑 是否应小于或大于

if ($("#seats").val() != '') {
    setflag = false;
    alert("Not a valid character")
}
else if($("#seats").val() < 99999) {
    alert("Not a valid Number");
} else {
    setflag = true;
}
jquery jquery-selectors
8个回答
20
投票

从早上起我就很困惑它是否应该小于或大于`

这个可以接受值小于“99999”

我想你自己回答了......但是当它小于时它是有效。因此以下说法是错误的:

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

您是说如果它小于 99999,那么它是无效。你想做相反的事:

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

此外,由于你有

$("#seats")
两次,jQuery 必须搜索 DOM 两次。您确实应该将值或至少 DOM 元素存储在变量中。你的一些代码没有多大意义,所以我将做出一些假设并将它们放在一起:

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;

这是一个工作示例:http://jsfiddle.net/LUY8q/


2
投票

除了现有答案之外,还有一些内容。看看这个:

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");
}

变量名 setFlag 非常通用,如果您仅将其与座位数结合使用,则应该重命名它(我将其称为席位验证)。我还将其初始化为 true,这消除了原始代码中最后的 else 的需要。接下来,我将选择器和对 .val() 的调用放入变量中。缓存选择器是一个很好的做法,这样 jquery 就不需要过多地遍历 DOM。最后,在比较两个值时,您应该尝试确保它们是相同的类型,在本例中,seatVal 是一个字符串,因此为了正确地将其与 99999 进行比较,您应该对其使用 parseInt() 。


1
投票
  <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>

0
投票

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

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

0
投票

请参阅此答案。 val() 正在比较字符串,而不是数值


0
投票
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>

0
投票

如果你想用 css 属性制作一些 if else ,你可以这样做,这个程序用于使用 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>


0
投票

注意:如果你想在 jQuery 中使用“else if”,请确保你写:

else if ( yourTestHere )

不是

elseif ( yourTestHere )

空间很重要。

© www.soinside.com 2019 - 2024. All rights reserved.