Question

在jQuery中，有没有办法创建一个对象数组，然后可以为它们添加一个处理程序？

例如，我有一个返回jQuery对象的函数，我想多次调用该函数。每次函数返回一个对象，我想将该对象添加到数组。一旦添加了所有对象，我想为它们添加一个处理程序...

以下是对期望结果的大幅简化......实际的处理程序要复杂得多，因此我不想每次都专门添加它

// I KNOW THIS DOESN'T WORK...
var allObj = [];
allObj.push(myFnc("#txt1"));
allObj.push(myFnc("#txt2"));
allObj.push(myFnc("#txt3"));
allObj.on("change", function() { alert("hello world"); });

// I also tried, this also failed
$(allObj).on("change", function() { alert("hello world"); });

我特别想知道是否可以创建对象集合。

我知道上面的一个解决方案如下，但这不是我的问题......

function handlerFnc() { alert("hello world"); }
myFnc("#txt1").on("change", handlerFnc);
myFnc("#txt2").on("change", handlerFnc);
myFnc("#txt3").on("change", handlerFnc);

Answer 1

您可以使用add()

创建一个新的jQuery对象，其中元素已添加到匹配元素集中。

＆＃13;

var myFnc = function(inputId) {
  var id = inputId.replace('#', '');
  var div = $('<div >', {
    id: inputId.replace('#', ''),
    text: inputId
  })
  div.appendTo(document.body)
  return div;
}

var allObj = myFnc("#txt1"); //Create initial object using first function call
allObj = allObj.add(myFnc("#txt2"));
allObj = allObj.add(myFnc("#txt3"));
allObj.on("click", function() {
  alert("hello world: " + this.textContent);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

Answer 2

通常有两种方法可以做到这一点：

与数组一起使用它。只需使用Array.prototype.forEach并将处理程序应用于每个元素：

var allObj = [];

allObj.push(myFnc("#txt1")); // I assume that myFnc returns jQuery object
allObj.push(myFnc("#txt2"));
allObj.push(myFnc("#txt3")); 

allObj.forEach(function($elem) {
    $elem.on("change", function() { alert("hello world"); });
});

将它与jQuery对象相结合并使用它。在@ Satpal的答案中描述了一种方法。您也可以将jQuery对象数组转换为类似jQuery数组的对象，这在以下问题中进行了描述：

Turn array of jQuery elements into jQuery wrapped set of elements

第二个看起来更合适对我来说。

创建对象集合，然后将处理程序添加到所有对象

2 个答案: