事件发生后如何将值传递给函数答案

【问题标题】：how can i pass a value to a function after event事件发生后如何将值传递给函数
【发布时间】：2013-10-29 15:09:54
【问题描述】：

            uiSlider: function(){                                   
                var arrLength = (this.cDat).length - 1,                 
                    value = this.cDat,                      
                    pieTitle = this.cDet,
                    config = this.anyChartConfig(); 

                    console.log( this.anyChartConfig(2) );              

                $( "#slider" ).slider({
                  range: "min",
                  min: 0,
                  max: arrLength,
                  step: 1,
                  change: function ( event, ui ) {                              
                    console.log( this.anyChartConfig(ui.value) );
                  }
                })
                .each(function() {
                  var opt = $(this).data().uiSlider.options;                      
                  var vals = opt.max - opt.min;                   
                  for (var i = 0; i <= vals; i++) {                     
                    var el = $('<label>'+ ( value[i]["title"] ) +'</label>').css('left',(i/vals*100)+'%');                      
                    $( "#slider" ).append(el);
                  }
                });                                             
            },

在第一个 console.log() 中它显示正确，但在第二个 console.log() 中它给我一个错误 {Object 不支持属性或方法 'anyChartConfig'}。而且我还想获取值并在更改后将其传递给函数，

【问题讨论】：

标签： jquery oop jquery-plugins

【解决方案1】：

滑块回调(change) 中的this 与uiSlider 方法中的this 是不同的对象（它是#slider 元素）。

一种可能的解决方案是使用闭包变量self，如下所示

uiSlider: function(){                                   
    var arrLength = (this.cDat).length - 1,                 
        value = this.cDat,                      
        pieTitle = this.cDet,
        config = this.anyChartConfig(), self = this; 

    console.log( this.anyChartConfig(2) );              

    $( "#slider" ).slider({
        range: "min",
        min: 0,
        max: arrLength,
        step: 1,
        change: function ( event, ui ) {                              
            console.log( self.anyChartConfig(ui.value) );
        }
    })
    .each(function() {
        var opt = $(this).data().uiSlider.options;                      
        var vals = opt.max - opt.min;                   
        for (var i = 0; i <= vals; i++) {                     
            var el = $('<label>'+ ( value[i]["title"] ) +'</label>').css('left',(i/vals*100)+'%');                      
            $( "#slider" ).append(el);
        }
    });                                             
}

为什么？关于this和closure variables，或许你可以了解更多

【讨论】：

它终于工作了！ :) 你能解释一下为什么我需要声明一个变量 self = this？