只对某些页面执行jQuery效果/操作
问题描述:
直到现在我已经把所有的jQuery代码放在document.ready函数中。我在想,在某些情况下这不是最好的选择。只对某些页面执行jQuery效果/操作
例如:如果我想在某个页面加载时执行动画,那么最好的方法是去做什么。
$(document).ready(function() {
$("#element_1").fadeIn();
$("#element_2").delay('100').fadeIn();
$("#element_3").delay('200').fadeIn();
});
如果这是正确的内部则每次任何页面加载它要检查每一行,并寻找该元素的document.ready的。告诉jquery只在特定页面上执行一段代码以避免此问题的最佳方式是什么?
答
通过检查elememt存在于页面上之前执行的动画
if ($("#element-1").length) {
$("#element-1").fadeIn();
}
与其他元素
等#element_2
和#element_3
到@numediaweb:
当前的jQuery is()
实施就像下面那样
is: function(selector) {
return !!selector && jQuery.filter(selector, this).length > 0;
},
因此,它可以更明智使用is()
,但它是更快地使用刚刚length
甚至更快起诉document.getElementById().length
答
只包括你希望在DOM准备好为要执行的代码特定页面。 $(document).ready(...
并不意味着您应该在每个页面上运行相同的代码块。这将需要执行各种检查以了解需要执行的内容。
我确定您将拥有一些您希望在每个页面上执行的常用功能,以及一些页面特定的功能。如果是这种情况,那么您可以将通用功能放入单一功能中,并从$(document).ready(...
中调用该功能,以使剩下的唯一代码专用于该特定页面。例如:
function common() {
alert('hello');
}
$(document).ready(function() {
common();
// do some page-specific stuff
});
我不同意在每一页上执行各种检查,以便代码知道我们在哪里。这似乎很麻烦的,完全可以避免的,比如:
function doAnimation() {
$("#element_1").fadeIn();
$("#element_2").delay('100').fadeIn();
$("#element_3").delay('200').fadeIn();
}
$(document).ready(function() {
if(window.location.href == 'http://example.com/foo') {
doAnimation();
}
if(this page has blah) {
doBlah();
}
});
理想的情况下,它应该是是:
$(document).ready(function() {
// do stuff for foo.php
});
因此,为了避免重复,我可以只对每个页面的主体元素一个唯一的ID和检查是否存在! – Galen 2010-04-30 16:20:27
是的,你是对的! – 2010-04-30 16:21:15
更好的方法是[将类属性设置为您的身体标记](http://*.com/questions/9578348/best-way-to-execute-js-only-on-specific-page/9578898#9578898 ) – numediaweb 2014-04-13 13:09:31