Jquery dialog( 'destroy' ) 后还有缓存 (转)

使用jQuery的Dialog控件时,jQuery会将创建的dialog缓存到页面上,生成一些隐藏的div,当再次创建dialog时,由于id相同总会调用缓存中的Dialog,导致无法显示想要显示的内容。查了dialog有destroy方法,依然没有作用。

baidu一下恍然,destroy销毁的jquery ui给你生成dialog时候的那些html,不会销毁元素本身,要销毁元素本身要用remove
<script>
function Test()
{
var $dialog = $('<div></div>').dialog({
autoOpen: true,
title: '测试内容',
buttons: {
"关闭": function () { $(this).dialog('close');},
"确定": function () { }
},
close: function () { $(this).remove(); },
open: function ()
{
$(this).html('加载你的页面');
}
});
}
</script>
补充:上面的方法可以把Dialog彻底清除,但连同Dialog中的DIV也同时清除了,在应用中通常是自建一个Div,通过Div的id绑定Dialog,而jquery会把这个自建的div清除,内容全部放到Dialog的Div中,Dialog的Div默认是建在body中,这对于使用ajax重写页面代码的应用产生了很多冲突,如果使用上面的方法你的Dialog将只能弹出一次,关闭的时候就会被remove。查了一下替代的解决方法,可以将自建的div先clone,在close时将克隆的div重新append到页面上。
<script>
function Test(divId)
{
var dialogParent = $(divId).parent();
var dialogOwn = $(divId).clone();
dialogOwn.hide();

var $dialog = $(divId).dialog({
autoOpen: true,
title: '测试内容',
buttons: {
"关闭": function () { $(this).dialog('close');},
"确定": function () { }
},
close: function () {
dialogOwn.appendTo(dialogParent);
$(this).dialog("destroy").remove();
},
open: function ()
{
$(this).html('加载你的页面');
}
});
}
</script>

这是在jquery1.8中发现的问题,在其他版本中是否还有尚未测试。


以上是我的解决方法,参考自http://forum.jquery.com/topic/dialog-will-move-its-div-tag-to-body


实现方式还可以优化,而且网上还有一些直接改了dialog的内核的方法可以参考。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值