追加函数在自定义JQuery函数上无所作为

Question

我试图在JQuery上创建一个函数来使事情变得简单...在元素上添加元素。这是代码，但它不工作

(function ($) { 
    $.fn.dataProvider = function (array) { 
     console.log(this); 
     console.log(array); 
     $.each(array, function (index, value) { 
      $(this[0]).append("<option value = '" + index + "' >" + value + "</option>"); 
     }); 
    }; 
})(jQuery); 

但是，这项工程！

$.each(array, function (index, value) { 
    $(this[0]).append("<option value = '" + index + "' >" + value + "</option>"); 
}); 

我不明白为什么...有人能帮助我吗？

Answer 1

如果你想创建一个插件，你需要为了维持chainability返回this元素：插件chainability的

LIVE DEMO

(function($) { 
    $.fn.dataProvider = function(arr) { 

    var that = this; 
    var opts = ""; 

    return that.each(function(){ 
     for(var i=0; i<arr.length; i++){ 
     opts += "<option value='"+ i +"'>"+ arr[i] +"</option>"; 
     } 
     that.append(opts); // Append only once // Faster! 
    }); 

    }; 
})(jQuery); 

例子：

var arr = ["foo", "bee"]; 
$('#sel').dataProvider(arr).css({color:"red"});