If/Else条件不运行第二次调用函数

If/Else Conditional not running the second time I call the function

本文关键字：第二次 调用 函数 运行 Else 条件 If      更新时间：2023-09-26

第一次运行函数时，两个条件都可以工作。但是当我第二次运行该函数时，新值"cute"不会改变背景图像。

$("#sbmt-button").click(newImage);
function newImage(){
    event.preventDefault();
    var cute = $("#cute").val();
    $("#cute").val(" ");
   if (cute == "kittens") {
      $("body").attr("class", "kittens");
        console.log(cute);
    } else if (cute == "puppies"){
       $("body").attr("class", "puppies");
      console.log(cute);
    } 
}
http://codepen.io/ElaineM/pen/jbYbwj

你的代码实际上是工作的，但唯一的事情是你需要使用$("#cute").val("");而不是$("#cute").val(" ");，它放了一个空格，它不匹配的值

同样，您也可以尝试这样做比较，通过修剪空格:

function newImage(){
    event.preventDefault();
    var cute = $("#cute").val().trim();
    $("#cute").val(" ");
   if (cute == "kittens") {
      $("body").attr("class", "kittens");
        console.log(cute);
    } else if (cute == "puppies"){
       $("body").attr("class", "puppies");
      console.log(cute);
    } 
}

$("#cute").val(" ");行在文本框中留出一个空格。您需要的是一个空字符串:$("#cute").val("");

用空字符串替换它似乎给你想要的输出

PROBLEM

您需要使用事件对象e传递给事件处理程序作为参数，否则您的button充当提交按钮，页面得到刷新。

<<p> 解决方案/strong>

请使用以下代码:

function newImage(e){
    e.preventDefault();
    var cute = $("#cute").val();
    console.log(cute);        
    if (cute === "kittens") {
       $("body").attr("class", "kittens");
    } else if (cute === "puppies"){
       $("body").attr("class", "puppies");
    } 
    // Reset input
    $("#cute").val("");
}

相关文章：