不可能将事件绑定到包含jQuery对象的数组

Question

i动态创建一个列表内容：

for (var i = 0; i<length; i++) {
    var $li = $('<li />', {
          text: ....
    }).appendTo($list);
    myArray.push($li);
    // This doesn't work
    $(myArray).click(function (e) { alert('cc'); });

但是当我获得创建元素的父母时，它起作用

// This works
$('ul.liste').first().find('li').click(function (e) {alert('cc'); });

1. $(myArray)和$('ul.liste').first().find('li')之间有什么区别？
2. 如何正确将JS数组转换为jQuery集合？我认为将数组用$()包裹起来，但显然不起作用。

Answer 1

而不是推动，您可以使用 add：

var $set = $();
for (var i = 0; i<length; i++) {
    var $li = $('<li />', {
          text: ....
    }).appendTo($list);
    $set = $set.add($li);
}
$set.click(...

如果您喜欢构建本机数组，然后将其转换为jQuery集合，则可以做

var $set = $.add.apply($(), myArray);

Answer 2

myArray是本机数组，您需要jQuery对象来绑定 $('ul.liste').first().find('li')返回的事件处理程序，从而可以工作。

您可以使用.add()创建jQuery对象的集合，然后使用它来绑定事件处理程序。

//Create empty jQuery object
var myArray = $([]);
var $list = $('.list')
for (var i = 0; i < 5; i++) {
  var $li = $('<li />', {
    text: i
  }).appendTo($list);
  myArray = myArray.add($li);
}
// This doesn't work
myArray.click(function(e) {
  console.log(this.textContent);
});

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

Answer 3

您需要在数组上 loop，

以下是不正确的，因为它没有在相应元素上绑定click事件。

 $(myArray).click(function (e) { alert('cc'); });

而不是循环为

 $(myArray).each(function(){
     $(this).click(function (e) { alert('cc'); });
 });

Answer 4

1）$（myarray）和$（'ul.liste'）之间有什么区别。First（）。查找（'li'）？

在这里，MyArray不是任何jQuery对象，而是包含jQuery对象作为其元素的普通数组。您永远不会将事件绑定到数组，字符串或任何其他数据类型。您始终将事件绑定到jQuery对象（包含一些DOM元素）。因此，您不应该绑定MyArray的每个元素，而不是绑定MyArray。当您使用$（'ul.liste'）时，它可以正常工作，因为它是一个带有某些dom元素的jQuery对象。

2）如何将JS数组正确转换为jQuery集合？我认为将数组用$（）包裹起来，但显然不起作用。

您不将JS数组转换为jQuery对象。但是您将任何DOM元素转换为jQuery对象例如，

var elem = document.getElementById("myElem"); // a DOM element
$(elem) //a jQuery object

数组只是为了保存一些数据而不是用于DOM操作。