jQuery忽略else if语句

jQuery ignores else if statement

本文关键字:语句 if else 忽略 jQuery      更新时间:2023-09-26

我正在开发一个web应用程序,要求用户通过输入StudentID和JobID添加"应用程序"。我使用jQuery让用户知道他们输入的学生不存在,工作不存在,应用程序已经存在于数据库中,或者应用程序已成功添加。我使用PHP检查后端上的所有内容,并将消息发送到前端以将其显示给用户。

一切工作正常,直到我使用if语句来决定我将根据从后端收到的消息显示给用户的消息。

jQuery完全忽略'else if'语句。如果第一个条件为真,则成功执行语句体,然而,如果第一个条件不为真,则直接执行else语句,忽略else If语句,即使它们为真。

代码如下:

var myData = {"tablename": tablename, "StudentId": StudentId, "JobId": JobId};
            $.ajax({
                url: "insert.php",
                type: "POST",
                data: myData,
                success: function (data, status, xhr) {
                    console.log(data);
                    if (data =="success") {
                        $('#message').fadeIn().delay(3000).fadeOut();
                        $('#StudentId').val('');
                        $('#JobId').val('');
                    } else if(data=="fail") {
                        $('#message5').fadeIn().delay(3000).fadeOut();
                    } else if (data =="student"){
                        $('#message2').fadeIn().delay(3000).fadeOut();
                    }
                      else if (data == "job"){
                        $('#message3').fadeIn().delay(3000).fadeOut();
                    }
                      else  {
                        $('#message4').fadeIn().delay(3000).fadeOut();
                    }
                }
            }); 

为什么不使用switch语句?我建议你使用它。switch语句用于根据不同的条件执行不同的操作。

现在你的代码应该可以工作了。解决方案如下:

switch(data){
        case "success":
          $('#message').fadeIn().delay(3000).fadeOut();
          $('#StudentId').val('');
          $('#JobId').val('');
          break;
       case "fail":
          $('#message5').fadeIn().delay(3000).fadeOut();  
          break;
       case "student":
          $('#message2').fadeIn().delay(3000).fadeOut();
          break;
       case "job":
          $('#message3').fadeIn().delay(3000).fadeOut();
          break;
       case "studentjob":
          $('#message4').fadeIn().delay(3000).fadeOut();
          break;                
}

作为测试方法的示例,我为您创建了一个活塞

一个简单的策略是创建测试按钮,强制您想要测试的响应,并将其捣碎,直到它正常工作。理想情况下,您应该创建单元测试并对其进行测试,但我可以想象您所做的事情过于简单。

。从plunkr:

<div>
  <button onclick="testSuccess()">Success</button>
  <button onclick="testFail()">Fail</button>
  <button onclick="testStudent()">Student</button>
  <button onclick="testJob()">Job</button>
  <button onclick="testStudentJob()">Student Job</button>
  <button onclick="testUnexpected()">Unexpected</button>
</div>
JavaScript

var testSuccess = function() {
  successFn("success");
}
var testFail = function() {
  successFn("fail");
}
var testStudent = function() {
  successFn("student");
}
var testJob = function() {
  successFn("job");
}
var testStudentJob = function() {
  successFn("studentjob");
}
var testUnexpected = function() {
  successFn("somethingSilly");
}

重构http调用:

var myData = {"tablename": tablename, "StudentId": StudentId, "JobId": JobId};
            $.ajax({
                url: "insert.php",
                type: "POST",
                data: myData,
                success: successFn 
            }); 

稍微修改一下if-else语句(强烈建议使用Alexandru Mihai的switch语句)

 var successFn = function (data, status, xhr) {
                console.log(data);
                if (data =="success") {
                    $('#message').fadeIn().delay(3000).fadeOut();
                    $('#StudentId').val('');
                    $('#JobId').val('');
                } 
                else if(data=="fail") {
                    $('#message5').fadeIn().delay(3000).fadeOut();
                } 
                else if (data =="student"){
                    $('#message2').fadeIn().delay(3000).fadeOut();
                }
                else if (data == "job"){
                    $('#message3').fadeIn().delay(3000).fadeOut();
                }
                else if (data == "studentjob") {
                    $('#message4').fadeIn().delay(3000).fadeOut();
                }
                else {
                  alert('Unexpected response');
                }
            };
https://plnkr.co/edit/KZrWMrcybko6P32yFopz

你有一个错误在你的if块,最后的else有一个条件。这应该在控制台中显示为错误。

else (data == "studentjob")更改为

else

else if (data == "studentjob")