我对jQuery和bootstrap下拉列表有问题。
这种方法有效:

$("ul li#airlines-list.dropdown.hlink").addClass("open");

但这种方法不起作用:
$(document).on('click', '#register-btn', function()
    {
        $("ul li#airlines-list.dropdown.hlink").addClass("open");
    });

-
<a id="register-btn" class="register-btn btn btn-custom btn-rnd animated
fadeInDown wow">Register</a>
<li id="airlines-list" class="dropdown hlink">
<a id="airlines-btn" href="#" data-toggle="dropdown" aria-expanded="true"><i class="ion-plane"></i>
</a>
<ul id="airlines" class="airlines dropdown-menu arrow">
//somestuff
</ul>
</li>

怎么了?
当我加载页面时,它会立即显示下拉列表。但当我点击register-btn时,它什么也不做。

最佳答案

好吧,两件事。首先,因为你有唯一的id(或者至少我希望如此-这就是html id的全部概念…),所以有$("#airlines-list")而不是$("ul li#airlines-list.dropdown.hlink")就足够了。
其次,在绑定click函数时,可能需要首先选择要绑定到的对象,而不是整个文档。看看下面的代码片段。

$('#register-btn').on('click', function()
    {
        alert("click");
        $("#airlines-list").addClass("open");
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="register-btn" class="register-btn btn btn-custom btn-rnd animated
fadeInDown wow">Register</a>
<li id="airlines-list" class="dropdown hlink">
<a id="airlines-btn" href="#" data-toggle="dropdown" aria-expanded="true"><i class="ion-plane"></i>
</a>
<ul id="airlines" class="airlines dropdown-menu arrow">
//somestuff
</ul>
</li>

关于jquery - jQuery addClass在负载下工作,但不能单击,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/39191050/

10-14 14:51
查看更多