[英]Unable to remove html content using JQUERY
I am unable to remove the div with ID "Third"
and display the result content in div with ID "Fourth"
. 我无法删除ID为"Third"
div并在ID为"Fourth"
div中显示结果内容。 Please Note :- I need to append #Third
content to #Fourth
and then remove at later stage. 请注意:-我需要将#Third
内容附加到#Fourth
,然后在以后删除。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="../jquery-ui-1.10.4.custom/js/jquery-1.10.2.js" type="text/javascript"></script>
<script src="../jquery-ui-1.10.4.custom/js/jquery-ui-1.10.4.custom.min.js" type="text/javascript"></script>
<link href="../jquery-ui-1.10.4.custom/css/ui-lightness/jquery-ui-1.10.4.custom.min.css"
rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(function() {
var widget = {}
$("#Vshowdialog").click(function() {
widget.doInitialize();
});
widget.doInitialize = function() {
$("#Fourth").append($("#First").html());
$("#Fourth").append($("#Second").html());
$("#Fourth").append($("#Third").html());
widget.showLightBox();
};
widget.showLightBox = function() {
text = $('#Fourth').html();
$(text).find("#Third").remove();
$("#Fourth").dialog();
};
});
</script>
</head>
<body>
<input type="button" id="Vshowdialog" value="ShowDialog" />
<div id="First">
<div id="content">
This is my main Firstcontent.</div>
<div id="sidebar">
This is a FirstSideBar</div>
</div>
<div id="Second">
<div id="secondOne">
This is my main Second content.</div>
<div id="secondTwo">
This is a second sidebar</div>
</div>
<div id="Third">
hello
<div id="thirdOne">
This is my main third content.</div>
<div id="thirdTwo">
This is a third sidebar</div>
</div>
<div id="Fourth">
</div>
</body>
</html>
You can use: 您可以使用:
$('#Fourth').append($('#third'));
$('#thirdOne').unwrap();
or 要么
$('#Fourth').append($('#Third')).find('#thirdOne').unwrap();
$(function() {
var widget = {}
$("#Vshowdialog").click(function() {
widget.doInitialize();
});
widget.doInitialize = function() {
$("#Fourth").append($("#First").html());
$("#Fourth").append($("#Second").html());
$("#Fourth").append($("#Third").html());
widget.showLightBox();
};
widget.showLightBox = function() {
$('#Fourth').find("#thirdOne").remove();
$('#Fourth').find("#thirdTwo").remove();
$("#Fourth").dialog();
};
});
Try this it will work fine. 试试这个,它将正常工作。
You're appending the "inner html" of the other elements to #Fourth
; 您要将其他元素的“内部html”附加到#Fourth
; to keep the identifiers intact you should do this: 为了保持标识符完整,您应该这样做:
$('#First,#Second,#Third').appendTo('#Fourth');
Then, at a later stage you can simply remove #Third
: 然后,在稍后阶段,您只需删除#Third
:
$('#Third').remove();
you'll want to initialize this variable 您将要初始化此变量
text = $('#Fourth').html();
But your looking for #Third within #Fourth when you only included the inner html, specificly 但是,当您仅包含内部html时,您会在#Fourth中寻找#Third
var text = $('#Fourth').html(); //contents of fourth
$(text).find("#Third").remove(); //third was added as inner Html without the wrapping container.
You should be able to just change 你应该能够改变
$("#Fourth").append($("#Third").html());
to 至
$("#Fourth").append($("#Third"));
The real question is why are you adding Third to Fourth and then removing it? 真正的问题是,为什么要在第三位到第四位添加然后删除它? Your code is equivalent to this, in execution, assuming it was fixed. 假设代码是固定的,则在执行时,您的代码与此等效。
$("#Fourth").append($("#Third"));
$("#Fourth").find("#Third").remove();
//cache the third div content
var tempThird = $('#Third');
//add your result to Fourth div
$('#Fourth').html("resultcontent");
//remove the third div
$('#Third').remove();
//tempThird will still have the essence of #Third div which you can use anywhere.
You can check the remove API documentation on http://api.jquery.com/remove/ 您可以在http://api.jquery.com/remove/上查看删除API文档。
Hope this solves your problem. 希望这能解决您的问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.