在JQuery中使用变量的正确方法是什么?
我想引用一个元素,然后重用它抛出我的代码,但我不确定正确的方式。以下是我的尝试,但它只适用于某些地方。 (编辑:作品,有一个更远的错误在我的代码,但我仍然好奇,如果这是最好的做法还是不行。)在JQuery中使用变量的正确方法是什么?
$(document).ready(function() {
var image = $("#content img");
image.wrap("<span />");
image.hover(function(){}, function(){});
});
你的代码对我来说看起来很好......在回调中创建一个局部变量,就像你做的一样,总是比使用全局对象更好。然而,jQuery的的美妙之处在于可以缩短你的代码,甚至不使用变量都:
$(document).ready(function() {
$("#content img").wrap("<span />").hover(function(){}, function(){});
});
这就是所谓的chaining,并允许您“链”了jQuery的方法共同目的是在一个表达。但是,如果你确实需要这个变量,我觉得没有什么问题。
这是一个很棒的提示,谢谢! – 2010-05-06 22:14:48
这应该工作。你有什么迹象表明image.hover()
不工作?
作为一个方面说明:这当然不是一个标准,但是当我做这样的事情时,我在$前面加上jQuery对象的变量,所以:var $image = $("#content img");
- 只是帮助我跟踪什么是一个jQuery对象。
它也适用于我。你是否试图在悬停函数中使用this.css(),this.attr()等,因为这是行不通的。您仍然必须使用它:$(this)。 – ryanulit 2010-05-06 19:58:56
谢谢,我甚至没有意识到我可以做到这一点。 – 2010-05-06 20:15:58
这是一个相当标准的做法吗?我喜欢。 – 2010-05-14 01:12:40
hover()
应该可以正常工作。在您传递到hover()
的函数内部,您可以使用$(this)
来获取要悬停的元素。所以:
$(document).ready(function() {
var image = $("#content img");
image.wrap("<span />");
image.hover(function(){
$(this).css({border:'5px solid red'});
}, function(){
$(this).css({border:'none'});
});
});
这对我有用。
你把它写在上面的方式,var image
是一个局部变量的作用域被称为onReady的匿名函数。因此,在该函数范围之外的任何对该变量的调用将产生ReferenceError
。在Javascript中,使用var
作为变量实例化的前缀将其标记为局部变量,而将其保留为全局变量(通常不适用)。考虑以下(人为)示例:
(function() {
global_variable = "global";
var local_variable = "local";
console.debug(global_variable);
console.debug(local_variable);
})();
console.debug(global_variable);
console.debug(local_variable);
// Produces:
global
local
global
ReferenceError: local_variable is not defined
我不确定我是否关注你,Jared。如果你看看下面的JS Bin,我(我认为)重复了你的例子,它运行良好。
也许问题是语法,或范围为本?另外,如果这是字面上的代码(显然是无细节的),那么我建议不要使用变量来存储这个。通常,当你要经常重复使用选择器时(例如“$ this = $(this)”),你会希望使用变量,否则保持代码简单到足以使用你需要的选择器可能会使事情对你更容易。
无论如何,我希望自己阅读正确,不会浪费时间。
我有另一个错误,导致这不工作,修复错误后,它工作正常。不过,我仍然好奇这是否是一种好的做法。我在下面看到有人提到使用JQuery对象var $ image更好吗? – 2010-05-06 20:14:43