jQuery:html(数据)未清除现有元素
我有三个jQuery:html(数据)未清除现有元素,jquery,Jquery,我有三个div元素,如下所示 <div id='branch-1'> <ul> <li><span>Parent-1</span></li> <li><span>Parent-2</span></li> <li><span>Parent-3</span></li> </ul>
div
元素,如下所示
<div id='branch-1'>
<ul>
<li><span>Parent-1</span></li>
<li><span>Parent-2</span></li>
<li><span>Parent-3</span></li>
</ul>
</div>
<div id='branch-2'></div>
<div id='branch-3'></div>
$(document).on("click", "div#branch-2 ul li span"function () {
$.ajax({
type: 'POST',
url: url,
data: data,
dataType: 'html',
async: false,
success: function (data) {
$("div#branch-3").html(data);
}
});
});
同样,如果用户单击第二个div
元素,那么我将使用ajax
在第三个div
中加载其子元素,如下所示
<div id='branch-1'>
<ul>
<li><span>Parent-1</span></li>
<li><span>Parent-2</span></li>
<li><span>Parent-3</span></li>
</ul>
</div>
<div id='branch-2'></div>
<div id='branch-3'></div>
$(document).on("click", "div#branch-2 ul li span"function () {
$.ajax({
type: 'POST',
url: url,
data: data,
dataType: 'html',
async: false,
success: function (data) {
$("div#branch-3").html(data);
}
});
});
实际问题:有时$(“div#branch-3”).html(数据)
没有清除现有数据,因此我在$(“div#branch-3”).html(数据)之前尝试过以下语句代码>
如果我将上述选择器
从div#branch-3
更改为div#branch-3 ul
或div#branch-3 li
则上述所有语句都运行良好
为什么html(数据)
无法替换现有数据
更改selector
后,尽管我将父元素id
传递为选择器
添加了其他信息:正如我在上面所说的有时。html(数据)
不会清除现有数据,以下就是这种情况
假设为Parent-1
有两个孩子,比如说child-1,child-2
,同样child-1
有两个孩子A,B
和child-2
有三个孩子X,Y,Z
。想想如果用户点击child-2
,那么X,Y,Z
就会显示在分支-3 div中,再次,如果用户单击Child-1
,则X,Y
将替换为A,B
,但Z
仍然存在。如果我试图在firebug中指出它的(Z)位置,那么它就会消失。试试这个-
$("div#branch-3").html(markUp).trigger("create");
实际上,正如我所想,您的问题是-success
函数没有被调用。要检查此想法是否正确,请向您的成功添加警告(“我加入!”):
success: function (data) {
alert("I'm in!");
$("div#branch-3").html(data);
}
你的意思是它将新数据与旧内容合并,而不是替换它?或者它根本不改变数据?我从未尝试过这样的行为,我在我的web应用程序中使用了大量的.html()和.empty()。你确定你的回拨电话打得很好吗?您是否尝试过使用控制台(F12)创建调试断点?@Barmar:假设我有两个child(child-1,child-2)作为Parent-1,child-1有两个child(a,B),child-2有三个child(X,Y,Z)。如果用户单击child-2,则X,Y,Z
显示在branch-3
div中,如果用户单击child-1,则显示X,Y将替换为A,B,但Z仍然存在。如果试着在firebug中指出它的(Z)位置,那么它就会消失。我很难理解这个解释。你能在问题中显示实际结果吗?@Barmar:一旦检查,我就更新了问题,无论我如何才能得到我想要的,但是我想知道它异常行为的原因在我看来,chorme和FF
中的检查就像jQuery或浏览器的版本问题,ajax
调用没有问题我已经检查了您的建议,我正在从ajax
调用中获取数据。是否调用了警报(“我在!”?