Push方法只能使用一次,除非之前使用过变量

时间:2010-02-28 15:57:05

标签: javascript jquery closures

这可能是一个奇怪的问题。无论如何,我正在研究一个jQuery插件,对于这个问题,这是一段很有用的代码,请注意,这不是全部;):

使用Javascript:

(function($){
    $.fn.newPlugin = function(){
        var ranges = [], selectableRange = this;

        function init(){
            selectableRange.live('mousedown', function(){
                selectableRange.live('mouseup', function(){
                    addRange(Math.random(), Math.random());
                    selectableRange.die('mouseup');
                });
            });
        }

        function addRange(a, b){
            // console.log(ranges);
            ranges.push({start: Math.min(a,b), end: Math.max(a,b)});
            console.log(ranges);
        }

        return { init: init };
    };
})(jQuery);

$(document).ready(function(){
    var instance = $('#element').newPlugin();
    instance.init();
});

HTML:

 <div id="element" style="width:200px;height:200px;background:grey;"> </div>

它的作用似乎毫无用处;无论如何,每当有人将鼠标放下然后放在一个元素上时,就会在ranges的背面添加一个新对象。不幸的是,在我的控制台中,范围数组只包含一个对象,无论点击$('#element')多少次。

我试图找出发生了什么,并在将对象推到范围数组的后面之前取消注释行console.log(ranges);。然后,令人惊讶的是,它奏效了。范围数组增长了......

有人可以告诉我为什么.push仅在以前使用ranges时才有效?

2 个答案:

答案 0 :(得分:0)

我很难理解你在这里想做什么。该返回值应该是什么意思?

我唯一能想到的是,你真正想要做的是在定义插件时运行一个函数,这样该函数本身就会返回实现插件的实际函数。事实上,它看起来好像你的数组中只有一个元素的原因是每次调用插件时都会创建一个新数组。看起来你正在尝试创建一个闭包,但是没有函数调用所以没有关闭。

尝试更改插件定义:

$.fn.newPlugin = (function() {
   // ...
   // all the code you currently have, though I still don't know
   // exactly what that return value is supposed to mean
   // ...
})();

答案 1 :(得分:0)

很抱歉,我问了这个问题......

Chrome的控制台以某种方式缓存了日志,并在日志的左侧显示了越来越多的数据。一切都很好......