JavaScript if-elseif语句

在PHP中，不同的if-elseif场景相互排除，对吗？我有点困惑，我似乎不明白为什么JavaScript中不是这样。有人能告诉我如何简化这个吗

（此语句连接到单选按钮，并应以不同的方式设置所选单选按钮的样式。但是，当我没有包括所有

删除

-部分时，单击其中一个部分，然后单击另一个部分，使我将这两个部分的样式都设置为“已选”）

---

因为您使用了两个选择器，并且使用值检查hello只适用于两个值返回相同值的选择器。如果两个选择器值产生不同的值，则您的条件永远不匹配

---

因此，只有当两个值相同时，它才会匹配。

要回答您的问题，是的，如果找到匹配项，if else块将停止计算

建议1： 尝试使用

==

而不是

=

。

=

检查值和类型是否相同

==1

在许多情况下都将被视为true，包括

'1'==1

和

true==1

。我不知道hello实际上是什么，但你可能会得到假阳性

建议2： 下面是修改后的代码建议（而不是if-else块）

---

我认为@Katana314对你提出的问题有正确的答案。Javascript不会在每次调用时刷新页面，因此类将保留在元素上，直到您删除它。这样可能会干净一点

$("#item-upload-form input").on("change", function() {


var hello = $("input[name='category_select']:checked", "#item-upload-form").val();

// find any element that has the selected class and remove it
$('.selected').removeClass('selected');

// then add it to which ever element needs it.
if(hello == 1){
   $("#handy").addClass("selected");
 } else if (hello == 2){
   $("#pc").addClass("selected");
 } else if (hello == 3){
   $("#notebook").addClass("selected");
 }

});

---

让我们只保留对addClass（）的调用。代码如下所示：

if(hello == 1){
   $("#handy").addClass("selected");
 } else if (hello == 2){
   $("#pc").addClass("selected");
 } else if (hello == 3){
   $("#notebook").addClass("selected");
 }

当你点击单选按钮时会发生什么？

---

R：每次只运行一个分支。连续单击只会将类添加到当前元素，并维护以前元素的类。

为什么不让jQuery为您完成所有工作？这样您就可以添加/删除选择，而无需更新代码：

$("#item-upload-form input").on("change", function (ele) {
    $("#item-upload-form input").each(function(  ) {
        if ($(this).prop('checked')){
            $(this).addClass("selected")
        } else{
            $(this).removeClass("selected") ;
        }
    });
});

---

你可以发布一个完整的代码示例，包括相关的HTML吗？其实很简单——当你认为PHP每次都是基于PHP文档重新呈现页面时，JavaScript只是以给定的方式改变当前状态。如果您添加了一个类，并且没有明确告诉它删除某个类，那么它不会删除它；它会一直保持这种状态，直到页面完全重新加载。减少此代码的一种方法是使用toggleClass:

$（'etc'）。toggleClass（“selected”，giveABooleanVarHere）

@Katana314非常感谢您的解释！好的，谢谢！：-）你知道我怎么不用几百行就可以写这个函数吗？你想要什么？两个值必须相同或任何值匹配？我不太理解你的问题。我需要实现的是一次只选择一个带有类

的单选按钮。因此，当用户单击
1
时，除
1
之外的所有类都不应选择
类。那么，为什么要使用两个选择器？这正是我的问题！：-）@Katana314的评论让我明白了这一点。无论如何谢谢你！
if(hello == 1){
   $("#handy").addClass("selected");
 } else if (hello == 2){
   $("#pc").addClass("selected");
 } else if (hello == 3){
   $("#notebook").addClass("selected");
 }

$("#item-upload-form input").on("change", function (ele) {
    $("#item-upload-form input").each(function(  ) {
        if ($(this).prop('checked')){
            $(this).addClass("selected")
        } else{
            $(this).removeClass("selected") ;
        }
    });
});