jQuery弹出层插件Thickbox使用心得

Thickbox官方网站(上面有例子和基本的使用方法):http://jquery.com/demo/thickbox/

就我使用过程中,Thickbox常见问题:

1。跨iframe的弹出层。

症状:每次thickbox都只在frame中弹出,而不会整个屏幕覆盖

原因和解决方法:

thickbox使用tb_show()函数在body后面加入弹出层。可以使用window.top.tb_show()把弹出层加到页面上。我的tihickbox插件中修改如下:在tb_init()中把tb_show(t,a,g)替换如下

if(a.indexOf('TB_iniframe')!=-1)  


{  


window.top.tb_show(t,a,g);  


}  


else  


{  


tb_show(t,a,g);  


} 

这样只只要在原来的链接上加入TB_iniframe=true即可,如div.aspx?height=180&width=400&TB_iframe=true&TB_iniframe=true&modal=true

2.thickbox只支持一层弹出,不可支持多层弹出。

修改过的控件已经支持(不足:ie6下失效弹出层失效了,占时没解决,哈哈)

3.弹出层关闭后,文本框无法聚焦。

症状:关闭弹出层后,原来页面上的文本框无法聚焦

原因和解决方法:这个的原因不好说,很多人都认为是ie本身的bug。是由于iframe没有移除,即使移除了。内存上也么有清除造成的。这也是我猜的。哈哈。解决方法是在tb_remove()中先手动移除iframe然后,在强制做垃圾回收,至少我是可以啦。哈哈。代码如下:

4.在asp.net中如何动态设置需要的参数和关闭弹出层。

症状:thickbox提供的例子都是需要在input后a的class加thickbox,而且参数什么都是固定的。而我们传递的参数一般需要动态。

解决方法,使用asp.netajax,不多说了。直接看代码吧。

封装一个popup类,

需要的js

functionShowPopup(url){  


window.top.tb_show(null,url,false);  


} 

页面上例子

相关推荐