Javascript DOM更新后jQuery丢失$（此）对象

HTML

<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>

我正在通过ajax加载数据

有两件事 （1） 悬停在李和 （2） 卷轴

---

如果用户同时触发这两个事件，滚动ajax调用的响应首先出现，然后将元素追加到DOM中，然后第二个ajax调用的响应出现，并且在成功回调中丢失了

$（此）

。

我认为您的问题是

$（此）

在ajax调用后不一样$（这）根据上下文而变化

$('ul').on('hover', 'li', function(){
 var li_element = $(this);
 // ajax call to get data
 // and put the response data into current li as html

 // here $(this) is lost if both event fire at same time and DOM updated via second ajax response
 //li_element is equalent to $(this) when hovered, so try:
 li_element.html(data); 
});

$( window ).scroll(function() {
  // ajax call to get the next content and append into list
  $( "ul" ).append( data );
});

---

似乎是

context：这，

应该在ajax调用中使用，因此如果您使用的是

jQuery.ajax（）

方法，那么您可以在它的选项中添加

context

：

$.ajax({
  url:'',
  ......
  context: this,
  ......
});

---

---

如果您使用

context

，那么其中提供的上下文将在ajax调用的所有回调中都可用。

这里的问题是JavaScript代码的其他部分在DOM中更改html，这就是丢失事件的问题，jQuery append可以正常工作，但是html在其他地方也会随之更改“innerHTML”

问题：

document.getElementById("ul_id").innerHTML = "<ul>...............</ul>";

document.getElementById（“ul_id”）.innerHTML=“
………
”；

使用jQuery append解决了问题

 $('#ul_id').append("<li>html code...</li>");

$（'ul#u id'）。追加（
html代码…
）；
$（'ul li'）。live（'hover'…
几乎是错误的，
hover
不是事件，
live（）
被弃用并从jQuery中删除。这并不是说它解决了问题，只是说。是的，我正在使用“on”“，但问题的解决方案是什么？我不明白问题所在。AJAX请求到底在哪里？我看不到它。这个
是如何丢失的？它的值没有改变。不同回调中的

这个的值可能会不同，但我看不到它在代码中的位置。您尝试过保存吗？”$（这）在进行ajax调用之前，是否在变量中？

 $('#ul_id').append("<li>html code...</li>");