jquery复选框如果语句不再工作答案

【问题标题】：jquery checkbox if statement not working anymorejquery复选框如果语句不再工作
【发布时间】：2020-09-14 21:57:08
【问题描述】：

letterChr、numberChr 和 symbolChr 最初被指定为 id，但最近在我需要第二组按钮（我在 html 和 javascript 上都这样做）之后必须将它们更新为一个类，而每个变体都适用于 if 语句将全局变量设置为 4 不会，而是默认为 3。任何帮助将不胜感激。

javascript 代码

var letterChr = $('.letters')
var numberChr = $('.numbers')
var symbolsChr = $('.characters')

function SelectorChr() {
  if (letterChr.is(':checked') && numberChr.is(':checked') && symbolsChr.is(':checked')) {
    chooser = 1
    console.log('checked')
  } else if (letterChr.is(':checked') && numberChr.is(':not(:checked)') && symbolsChr.is(':not(:checked)')) {
    chooser = 3
    console.log('checked 3')

  } else if (letterChr.is(':checked') && numberChr.is(':not(:checked)') && symbolsChr.is(':checked')) {
    chooser = 4
    console.log('checked 4')
  } else {
    chooser = 0
    alert('No checkboxes have been selected')
    return
  }
}

html代码

<ul class="list-group list-group-flush">
  <li class="list-group-item">
    <label for="letters">Letters</label>
    <input type="checkbox" class="letters">
  </li>
  <li class="list-group-item">
    <label for="numbers">Numbers</label>
    <input type="checkbox" class="numbers">
  </li>
  <li class="list-group-item">
    <label for="characters">Characters</label>
    <input type="checkbox" class="characters">
  </li>
</ul>

【问题讨论】：

letterChr、numberChr 和 symbolsChr 在哪里？您还没有在代码中包含从哪里获得这些内容。请edit您的问题包含所有相关代码，以便我们了解正在发生的事情并能够提供帮助。
你可能只需要改变你的 jQuery 选择器。
好的，我刚刚更新了它
根据类的正常使用方式，从 id 更改为类可能会获得多个结果。为什么不输出 letterChr、numberChr 和 symbolsChr，看看它们是什么。
第一个 else if 语法无效。阅读您的控制台 (F12)

标签： javascript html jquery if-statement checkbox

【解决方案1】：

我制作了一个简单的 html 页面来测试你的代码，我发现你不应该使用 numberChr.is(':not(:checked)') 而应该使用 !numberChr.is(':检查'）。请参阅下面的代码示例。我想这就是你要找的。p>

<ul class="list-group list-group-flush">
    <li class="list-group-item">
      <label for="letters">Letters</label>
      <input type="checkbox" class="letters">
    </li>
    <li class="list-group-item">
      <label for="numbers">Numbers</label>
      <input type="checkbox" class="numbers">
    </li>
    <li class="list-group-item">
      <label for="characters">Characters</label>
      <input type="checkbox" class="characters">
    </li>
  </ul>
  <script type="text/javascript">
        var letterChr = $('.letters')
        var numberChr = $('.numbers')
        var symbolsChr = $('.characters')

        function SelectorChr(){
            if (letterChr.is(':checked') && numberChr.is(':checked') && symbolsChr.is(':checked')) {
                chooser = 1
                console.log('checked')
            } else if (letterChr.is(':checked') && !numberChr.is(':checked') && !symbolsChr.is(':checked')) {
                chooser = 3
                console.log('checked 3')

            } else if (letterChr.is(':checked') && !numberChr.is(':checked') && symbolsChr.is(':checked')) {
                chooser = 4
                console.log('checked 4')
            } else {
                chooser = 0
                alert('No checkboxes have been selected')
                return
            }
        }
  </script>

【讨论】：

【解决方案2】：

所以问题似乎只在第二个按钮集保持不变并且仅在特定条件 4 的情况下才会持续存在。所以我通过在 document.ready 函数之外添加一个元素删除函数来解决它并称之为一天。

所以感谢大家帮助我，我非常感谢。

【讨论】：