Question

我正在构建一个jQuery插件。初始代码是这样的：

if (typeof Object.create !== 'function') {
   Object.create = function(obj) {
    function F() {};
    F.prototype = obj;
    return new F();
};

}(function($, window, document, undefined) {
var Datatable = {
    init: function(options, elem) {
      console.log(options);
        var self = this;
        self.elem = elem;
        self.$elem = $(elem);
    //  if (typeof options !== 'string') {
            self.options = $.extend({}, $.fn.SonalDataTable.options,   options);
    //  }
        console.log(self.options);
        self.cycle();
    },
    cycle: function() {
        var self = this;
        self.buildTable();
    },
    buildTable: function() {
        var self = this;
        self.getTableInfo();
    },
    getTableInfo: function() {
        var self = this;
        $.getJSON(self.options.url + 'initiate', function(data) {
            //   this.options.table = data;
            console.log(self.options);
        });
    }
};
$.fn.SonalDataTable = function(Opt) {

  console.log(Opt); // Pos1  : it shows every object that i pass like { test : 'it is a real test'}

    return this.each(function(Opt) {
      console.log(Opt); // Pos2 : it Only and Only shows 0;
        var datatable = Object.create(Datatable);

        datatable.init(Opt, this);
        //console.log(datatable);
    });
};
$.fn.SonalDataTable.options = {
    create: 'new',
    delet: 'trash',
    url: window.location.href,
    table: {

        limit: 10
        }

};
})(jQuery, window, document);

在上面的代码中，名为Pos1：和Pos2的评论中有2个地方：正如你在Pos1中看到的那样，我可以看到我在控制台日志中传递给这个插件但在Pos2只能在控制台日志中看到0。什么是我的问题。我不能将'选择'传递给'每个'功能？

问题在于这部分代码：

 $.fn.SonalDataTable = function(Opt) {

console.log(Opt); // Pos1  : it shows every object that i pass like { test :   'it is a real test'}

  return this.each(function(Opt) {
  console.log(Opt); // Pos2 : it Only and Only shows 0;
    var datatable = Object.create(Datatable);

    datatable.init(Opt, this);
    //console.log(datatable);
 });
};

我的问题是我无法将'Opt'对象传递给'this.each'函数。

Answer 1

我会尽力描述为什么你所看到的与预期完全一样。

让我们从这里开始：

$.fn.SonalDataTable = function(Opt) {

  console.log(Opt); // Pos1  : it shows every object that i pass like { test : 'it is a real test'}
   ...

让我们删除JQuery插件的上下文，并将其作为任何旧函数

function SonalTestFunction(Opt)
{
    console.log(Opt);
}

这里有一个函数，它接受一个参数Opt，传入的任何内容都将被写入控制台。

SonalTestFunction(42); // writes "42" to the console
SonalTestFunction({foo:"bar"}); // writes "{foo:"bar"}" to the console

现在，让我们再看一下第二个函数：

return this.each(function(Opt) {
  console.log(Opt); // Pos2 : it Only and Only shows 0;     
});

在这种情况下，您将调用JQuery each函数，该函数本身采用“回调”函数，该函数为jquery数组中的每个元素调用。此回调的参数是

项目的索引
项目本身（在您的示例中未见）

这应该告诉你为什么你只看到输出“0” - 只有一个元素在你正在调用each的数组中，它的索引是0。< / p>

你已经重新使用了一个参数名称，这很好，但你在第一个函数中嵌套了 - 我怀疑你期望值传递，但它不是 - 而是第二个用法隐藏了第一

就修复代码而言，我希望您尝试做的是：

$.fn.SonalDataTable = function(Opt) {

    console.log(Opt); // Pos1  : it shows every object that i pass like { test :   'it is a real test'}

    return this.each(function(i) { // note use of more appropriate variable, which does not hide the earlier use of Opt
         console.log(Opt); // Pos2 : will now show what you expect
        var datatable = Object.create(Datatable);

        datatable.init(Opt, this);
     });
};

Answer 2

您的问题是each回调的第一个参数是数组的index。

您使用名称Opt作为该参数名称，因此在Opt内使用完全不同的each变量。

假设您在初始化插件时只在选择器集合中使用了一个元素，您看到的0是集合中元素的索引

变化：

return this.each(function(Opt)

要：

return this.each(function(/*[index, [element]]*/)
// i commented out the optional arguments since you aren't using them

构建jQuery插件，Object没有传递给'each'函数

2 个答案: