jQuery - 需要在另一个函数中使用第一个函数的变量吗?

时间:2011-01-26 13:11:31

标签: javascript jquery scope

Uber Noob,但我以为我很接近。

var markers = $j('span.marker');

$j(markers).each(function () { //function to store original marker positions 
    var startOrigin = $j(this).css('margin-left');

});

$j("a.timeline-view").click(function () { //function to return markers to stored positions
    $j(markers).each(function () {

        $j(this).animate({
            marginLeft: startOrigin
        })

    });
});

第二个函数找不到var ??

2 个答案:

答案 0 :(得分:1)

我假设$ j == jquery的别名

问题的解决方案是使用jquery .data('name', val)存储绑定到元素的值,然后在必要时使用.data('name')检索它。

$j(markers).each(function(){ //function to store original marker positions 

       $j(this).data('startOrigin', $j(this).css('margin-left'));

});

$j("a.timeline-view").click( function() { //function to return markers to stored positions
    $j(markers).each(function(){
        var marker = $j(this);
        marker.animate({marginLeft : marker.data('startOrigin') })
    });         
});

检查http://api.jquery.com/jQuery.data/以获取有关使用jQuery数据的更多信息

答案 1 :(得分:1)

解释为什么你的代码不起作用......

Javascript中的函数在范围内包含在包含函数或函数中声明的所有变量。使用var关键字将变量设置为当前范围。在您的示例中,startOrigin仅在第一个函数的范围内。如果将它放在父作用域中,则示例中的所有函数都将在其作用域中使用它:

var markers = $j('span.marker');
var startOrigin;  // declare the variable in this scope

markers.each(function () { //function to store original marker positions 
    startOrigin = $j(this).css('margin-left'); // use the parent scope
});

$j("a.timeline-view").click(function () { //function to return markers to stored positions
    markers.each(function () {

        $j(this).animate({
            marginLeft: startOrigin // use parent scope
        })

    });
});

但请注意,此示例无论如何都有点破碎。您循环遍历整个标记集,每次都覆盖startOrigin。您需要使用data作为Tom Tu在his answer中为单个DOM元素设置数据。