如何修改以下3行代码,以便他们使用$(文档)?
$('.navbar li ul').slideToggle(300);
和
$('.navbar > li:first-child > span').text("Category");
和
if (!container.is(e.target)
文件用法的例子:
document.getElementById("input1").focus();
和
$(document).on('click', '.navbar ul span', function(event) {
});
和
$(document).mouseup(function (e) {
});
等...
答案 0 :(得分:2)
看来你对jQuery选择器感到有些困惑。
$('.navbar li ul').slideToggle(300);
已经搜索了整个文档。如果省略jQuery对象的第二个参数,则隐式为document
。所以,上面的选择器等同于:
$('.navbar li ul', document).slideToggle(300);
省略document
作为第二个参数是一个捷径。如果它不存在,则默认情况下由jQuery库假定。
这样的事情:
document.getElementById("input1")
是一个简单的Javascript语句 - 没有jQuery,没有CSS选择器。它是通过id查找元素的另一种方式,大致相当于jQuery语句:
$("#input1")
或普通的Javascript:
document.querySelector("#input1");
根据您的评论,似乎您可能会问的是如何使用委派事件处理,以便您的查询可以使用动态创建的元素。如果是这种情况,您应该编辑您的问题以实际说出来。将来,请描述您要解决的问题,而不是您尝试的解决方案。然后,我们可以更全面地帮助您。
如果是这种情况,那么您可以使用它,然后委托事件处理仅适用于事件处理程序,它不适用于一次性命令,如:
$('.navbar li ul').slideToggle(300);
这将适用于您运行它时出现的任何元素,并且没有document
等效或任何方式可以使动态元素更好或更差。它可以在您调用它时出现任何元素,因为它不是未来事件的事件处理程序安装。它是您在此特定时刻执行的操作,因此它只能处理当前存在的元素。
您可能会发现这些其他答案对于了解有关这些问题的更多信息非常有用:
Should all jquery events be bound to $(document)?
jQuery .live() vs .on() method for adding a click event after loading dynamic html
JQuery Event Handlers - What's the "Best" method
Does jQuery.on() work for elements that are added after the event handler is created?