Question

黄釉。因此，我一直在尝试开发各种各样的小型Web应用程序，并尝试了解前端开发的构建块。随着我的进展，我得到了一个难题，我能够解决这个问题，但我无法弄清楚为什么我这样做不起作用。

以下是相关的HTML供参考：

<div>
  <div>
    <span>Searching for a specific one?</span>
    <div class="dropdown-btn">
      <span>Pick one!</span>
    </div>
    <div class="dropdown-list">
      <ul>
        <li>One</li>
        <li>Two</li>
        <li>Three</li>
      </ul>
    </div>
  </div>
  <div id="results" class="nothing">
    <p>Fanfare</p>
  </div>
</div>

相关的Javascript：

var
    ddbtn = $(".dropdown-btn"),
    res = $("#results");

$(document).ready(function () {
    ddbtn.click(function () {
        res.removeClass("nothing");
        res.addClass("lower");
    });
    $(document).click(function() {
        res.removeClass("lower");
    });
});

想法是在打开和关闭#results时更改.dropdown-list的属性（该脚本在另一个文件中，但它与问题无关），通过添加并将类删除到#results。但我似乎无法弄清楚为什么这不起作用，至少当我在Safari＆amp;铬。我尝试alert()进行测试，但看起来它永远不会发射。

这很奇怪，因为我已尝试过其他方式，而且它们完美无缺。不使用变量并声明选择器本身有效：

$(document).ready(function () {
    $(".dropdown-btn").click(function () {
        $("#results").removeClass("nothing");
        $("#results").addClass("lower");
    });
    $(document).click(function() {
        $("#results").removeClass("lower");
    });
});

甚至将变量仅保存为字符串并将其用作$(<string>)也可以：

var
    ddbtn = ".dropdown-btn",
    res = "#results";

$(document).ready(function () {
    $(ddbtn).click(function () {
        $(res).removeClass("nothing");
        $(res).addClass("lower");
    });
    $(document).click(function() {
        $(res).removeClass("lower");
    });
});

哎呀，我甚至在另一个.js文件上有同一行var ddbtn = $(".dropdown-btn")，这似乎工作正常。我真的很想知道为什么第一种方法没有按预期工作;

，不确定我是否遗漏了一些基本的东西，所以请提前谢谢！

jQuery选择器工作，但不存储在变量中？

0 个答案: