我开始一个项目与jQuery。
在你的jQuery项目中有哪些陷阱/错误/误解/滥用/误用?
我开始一个项目与jQuery。
在你的jQuery项目中有哪些陷阱/错误/误解/滥用/误用?
当前回答
避免滥用文件准备。 保持文档仅为初始化代码准备。 始终在文档外部提取函数,以便它们可以被重用。
我在doc ready语句中看到了数百行代码。丑陋,不可读,不可能维护。
其他回答
如果你多次bind()同一个事件,它将多次触发。为了安全起见,我通常总是unbind('click').bind('click')
我对JavaScript也这么说,但是jQuery, JavaScript永远不应该取代CSS。
另外,确保站点对于关闭JavaScript的人来说是可用的(现在不像以前那么重要了,但拥有一个完全可用的站点总是好的)。
用回调“链接”动画事件。
假设你想让一个段落在点击后消失。您还希望随后从DOM中删除该元素。你可能认为你可以简单地链接这些方法:
$("p").click(function(e) {
$(this).fadeOut("slow").remove();
});
在这个例子中,.remove()将在. fadeout()完成之前被调用,破坏渐变效果,只是让元素立即消失。相反,当你想在完成前一个命令后才触发一个命令时,使用回调函数:
$("p").click(function(e){
$(this).fadeOut("slow", function(){
$(this).remove();
});
});
. fadeout()的第二个参数是一个匿名函数,它将在. fadeout()动画完成后运行。这使得逐渐褪色,并随后删除元素。
如果你想让用户在他们的浏览器中看到html实体,使用'html'而不是'text'来注入Unicode字符串,例如:
$('p').html("Your Unicode string")
误解在正确的上下文中使用此标识符。例如:
$( "#first_element").click( function( event)
{
$(this).method( ); //referring to first_element
$(".listOfElements").each( function()
{
$(this).someMethod( ); // here 'this' is not referring first_element anymore.
})
});
这里有一个解决方法的例子:
$( "#first_element").click( function( event)
{
$(this).method( ); //referring to first_element
var $that = this;
$(".listOfElements").each( function()
{
$that.someMethod( ); // here 'that' is referring to first_element still.
})
});