Javascript/jqueryif条件

我目前在使jqueryif语句工作时遇到问题。我一直在看Javascript中关于if语句的在线教程以及jQuery的文档，以尝试实现这一点，但仍然无法实现。我在下面包含了我的JS的一个片段

($('#modem-include').click(function () {
    if ($(this).hasClass("btn-info")) {
        $(this).addClass("btn-success");
        $(this).removeClass("btn-info");
        $(this).text("SELECTED");
    } else {
        $(this).text("SELECTED");
    }
    if ($('#modem-nothanks').hasClass("btn-success")) {
        $(this).addClass("btn-info");
        $(this).removeClass("btn-success");
        $(this).text("SELECT");
    } else {
        $(this).text("SELECT");
    }
}));
($('#modem-nothanks').click(function () {
    if ($(this).hasClass("btn-info")) {
        $(this).addClass("btn-success");
        $(this).removeClass("btn-info");
        $(this).text("SELECTED");
    } else {
        $(this).text("SELECTED");
    }
    if ($('#modem-include').hasClass("btn-success")) {
        $(this).addClass("btn-info");
        $(this).removeClass("btn-success");
        $(this).text("SELECT");
    } else {
        $(this).text("SELECT");
    }
}));

无论我尝试什么，这似乎都不起作用

想知道我是否遗漏了一些明显的东西

提前谢谢。

如果我理解正确（我不确定），请尝试以下方法：

$('#modem-include').click(function () {
  var $this = $(this), $that = $('#modem-nothanks');
  if ($this.hasClass("btn-info")) {
      $this.removeClass("btn-info");
      $this.addClass("btn-success");
      $this.text("SELECTED");
  } else {
      $this.text("SELECT");
  }
  if ($that.hasClass("btn-success")) {
      $that.removeClass("btn-success");
      $that.addClass("btn-info");
      $that.text("SELECT");
  } else {
      $that.text("SELECTED");
  }
});
$('#modem-nothanks').click(function () {
  var $this = $(this), $that = $('#modem-include');
  if ($this.hasClass("btn-info")) {
      $this.removeClass("btn-info");
      $this.addClass("btn-success");
      $this.text("SELECTED");
  } else {
      $this.text("SELECT");
  }
  if ($that.hasClass("btn-success")) {
      $that.removeClass("btn-success");
      $that.addClass("btn-info");
      $that.text("SELECT");
  } else {
      $that.text("SELECTED");
  }
});

如果我理解正确（我不确定），请尝试以下方法：

$('#modem-include').click(function () {
  var $this = $(this), $that = $('#modem-nothanks');
  if ($this.hasClass("btn-info")) {
      $this.removeClass("btn-info");
      $this.addClass("btn-success");
      $this.text("SELECTED");
  } else {
      $this.text("SELECT");
  }
  if ($that.hasClass("btn-success")) {
      $that.removeClass("btn-success");
      $that.addClass("btn-info");
      $that.text("SELECT");
  } else {
      $that.text("SELECTED");
  }
});
$('#modem-nothanks').click(function () {
  var $this = $(this), $that = $('#modem-include');
  if ($this.hasClass("btn-info")) {
      $this.removeClass("btn-info");
      $this.addClass("btn-success");
      $this.text("SELECTED");
  } else {
      $this.text("SELECT");
  }
  if ($that.hasClass("btn-success")) {
      $that.removeClass("btn-success");
      $that.addClass("btn-info");
      $that.text("SELECT");
  } else {
      $that.text("SELECTED");
  }
});

---

我简化了ID和类，使它们在进行触发器操作时更易于遵循。要修复代码，只需注意

这个

，因为它是对函数所有者的引用。因此，每个函数的前半部分选择器是正确的，但是每个函数的后半部分选择器不是

this

。您可以判断选择器是作为事件的源（

event.target

）启动的，还是正在委派事件（

.on（）

）

注意：我将

SELECT

和

SELECTED

文本放置在一个单独的

输出中

一小条

$（'yes'）。在（'click'，function（）上{
if（$（this）.hasClass（“btn信息”））{
$（this）.addClass（“btn成功”）.removeClass（“btn信息”）
$（'yesOut'）。文本（“选定”）；
if（$（'#no'）.hasClass（“btn成功”））{
$（'否'）.addClass（“btn信息”）.removeClass（“btn成功”）；
$（'#noOut'）。文本（“选择”）；
}
}
});
$（'#否'）。在（'单击'，函数（）上）{
if（$（this）.hasClass（“btn信息”））{
$（this）.addClass（“btn成功”）.removeClass（“btn信息”）；
$（'#noOut'）。文本（“选定”）；
if（$（'#yes'）.hasClass（“btn成功”））{
$（“#是”）.addClass（“btn信息”）.removeClass（“btn成功”）；
$（'yesOut'）。文本（“选择”）；
}
}
});

是/否
否

关于第




是

状态为“是”
我简化了ID和类，使它们在转换时更易于遵循。要修复代码，只需注意
这个
，因为它是对函数所有者的引用。因此，每个函数的前半部分选择器是正确的，但是每个函数的后半部分选择器不是
this
。您可以判断选择器是作为事件的源（
event.target
）启动的，还是正在委派事件（
.on（）
）

注意：我将
SELECT
和
SELECTED
文本放置在一个单独的
输出中

一小条

$（'yes'）。在（'click'，function（）上{
if（$（this）.hasClass（“btn信息”））{
$（this）.addClass（“btn成功”）.removeClass（“btn信息”）
$（“#yesOut'）.text（“选定”）；
if（$（'#no'）.hasClass（“btn成功”））{
$（'否'）.addClass（“btn信息”）.removeClass（“btn成功”）；
$（'#noOut'）。文本（“选择”）；
}
}
});
$（'#否'）。在（'单击'，函数（）上）{
if（$（this）.hasClass（“btn信息”））{
$（this）.addClass（“btn成功”）.removeClass（“btn信息”）；
$（'#noOut'）。文本（“选定”）；
if（$（'#yes'）.hasClass（“btn成功”））{
$（“#是”）.addClass（“btn信息”）.removeClass（“btn成功”）；
$（“#yesOut'）.text（“选择”）；
}
}
});

是/否
否

关于第




是

状态为“是”
您所说的“似乎不起作用”是什么意思？什么不起作用？
这个
引用的是一个DOM元素，它与jQuery对象不同。观察开发人员控制台中的错误。将
此
替换为
$（此）
。您需要将DOM对象转换为jQuery实体。@aᴍɪʀ类和文本都没有改变，它们与以前一样（好像没有确认单击）。您的代码总是以
此.text（“选择”）结尾。卸下两个
else
零件。请解释您期望代码做什么，因为它现在没有意义。您所说的“似乎不起作用”是什么意思？什么不起作用？
这个
引用的是一个DOM元素，它与jQuery对象不同。观察开发人员控制台中的错误。将
此
替换为
$（此）
。您需要将DOM对象转换为jQuery实体。@aᴍ类和文本都没有改变，它们与以前一样（好像它没有确认点击一样）。您的代码总是以
this.text（“SELECT”）结尾。卸下两个
else
零件。请解释一下你期望代码做什么，因为它现在没有意义。好！我编辑了最终答案，以使选择正确。谢谢。工作正常，只需做一个小的更改，使按钮总是根据单击的内容将文本更改为所需的值（如果设置了
btn success
类，则我需要
“选择”
，否则我需要
“选择”
但这很容易更改。您的代码也很容易理解。很好！我编辑了最终答案，以获得正确的选择/选择选项。谢谢。效果很好，只需做一个小更改，按钮就会根据单击的内容将文本更改为所需的值（如果设置了
btn success
类，我需要
“SELECTED”
，否则我需要
“SELECT”
，但这很容易更改。您的代码也很容易理解。