我对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/