嘿伙计们,我试图重新附加一个元素,当它从DOM中分离出来但是我似乎无法找到一个简单的解决方案。
$(document).on('click', '#emailEnquiryPreferred', function () {
$('.form-group-timepicker').fadeOut(300, function(){ $(this).detach(); });
});
正如您在下面的代码中看到的那样,我正在分离它,但是在另一个点击事件中我想将其重新连接到相同的位置,如何做到这一点?
由于
答案 0 :(得分:0)
在附加之前将其保持为变量:
var $detachedElement;
$(document).on('click', '#emailEnquiryPreferred', function () {
$('.form-group-timepicker').fadeOut(300, function(){
$detachedElement = $(this);
$(this).detach();
});
});
现在,当您需要重新附加它时,请使用$detachedElement
变量...
以下是完整的示例:
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
var $detachedElement;
$(document).ready(function() {
$('#id2').on('click', function() {
$('#div').append($detachedElement);
})
$("p#id1").click(function() {
$detachedElement = $(this).detach();
});
});
</script>
</head>
<body>
<div id="div" style="border: red solid 1px">
<p id="id1">Detach Me!</p>
</div>
<p id="id2">Re-attach it!</p>
</body>
</html>
答案 1 :(得分:-2)
您可以存储已分离的元素:
var p = $(this).detach();
您需要将此元素存储在某处(例如在某个对象中):
var detachedObj = null;
$(document).on('click', '#emailEnquiryPreferred', function () {
$('.form-group-timepicker').fadeOut(300, function(){
if(detachedObj == null)
detachedObj = $(this).detach();
else
{
$(this).attach(detachedObj);
detachedObj = null;
}
});
});
您可以在.detach()的jQuery API文档中看到类似的示例(阅读示例部分):jQuery .detach()