javascript - 原型(prototype)模式，在 jQuery $.each 函数中使用 'this'

Question

我想建立一个 <select>通过我的 object 中的 XML 数据.我想为所有这些使用原型(prototype)模式，我不得不承认我是模式方面的新手。这是我拥有的:

HTML 示例:

<select id="ddFullName" name="Full_Name" ></select>

XML 示例:

<names>
  <nameDetails name="Name 01" phone="555-867-5309" email="none@nothing.no" />
  <nameDetails name="Name 02" phone="555-867-5309" email="none@nothing.no" />
  <nameDetails name="Name 03" phone="555-867-5309" email="none@nothing.no" />
  <nameDetails name="Name 04" phone="555-867-5309" email="none@nothing.no" />
  <nameDetails name="Name 05" phone="555-867-5309" email="none@nothing.no" />
</names>

JavaScript 示例:

function buildNameDropdown(data, elem) { 
    this.data = data;
    this.name = $(data).find('nameDetails');
    this.elem = elem;

    buildNameDropdown.prototype.init = function()
    {
        //Working as desired
        $(this.elem).append($('<option value=""> ----- Select a Name ----- </option>')); 
        //Not working
        $(this.name).each(function()
        {
            //$(this) = the object, not 'this.name'
            $(this.elem).append($('<option value="' + $(this).attr('name') + '">' + $(this).attr('name') + '</option>'));

        });
        $(this.elem).combobox(); // from jQuery UI combobox extension
    };
};


var myNameDropdown = new buildNameDropdown(data, "#ddFullName");
myNameDropdown.init();

我应该如何将“this”引用为每个函数的选择器？

Answer 1

将 this 引用复制到局部变量。这样它将在回调函数的闭包中可用。

(旁注:你不应该在构造函数中设置原型(prototype)，那样你会为你创建的每个实例重新分配它。)

function buildNameDropdown(data, elem) { 
  this.data = data;
  this.name = $(data).find('nameDetails');
  this.elem = elem;
};

buildNameDropdown.prototype.init = function() {
  $(this.elem).append($('<option value=""> ----- Select a Name ----- </option>')); 
  var t = this;      
  $(this.name).each(function() {
    $(t.elem).append($('<option value="' + $(this).attr('name') + '">' + $(this).attr('name') + '</option>'));
  });
  $(this.elem).combobox(); // from jQuery UI combobox extention
};