wBox

三水清 2010-03-08 21:56:56173 Comments

jQuery插件wBox 1.0正式发布——经过一系列的wBox需求分析，进行了wBox的代码重构，去除了一些鸡肋的功能~根据公司项目的需要进行了功能的调整，并且在界面上进行了美化处理~

wBox截图

wBox截图

查看wBox代码实例wBox1.0下载

wBox新功能及其变化

  1. 优化代码~
  2. 美化界面~
  3. 默认可拖动，drag为false关闭
  4. 新增wBox关闭方法：wBox.close()
  5. 新增wBox打开方法：wBox.showBox()
  6. 新增wBox定时关闭设置：通过参数timeout设置定时关闭时间
  7. 新增在不触发click事件的前提，显示wBox，$(s).wBox({show:true})
  8. 去除灯箱功能（准备做一个单独的jQuery灯箱插件）
  9. 去除设置窗口位置

wBox功能特点

  1. 背景透明度可以根据实际情况进行调节
  2. 可以根据需要添加wBox标题
  3. 支持callback函数
  4. 支持html内容自定义
  5. 支持在wBox显示#ID的内容
  6. 支持Ajax页面内容
  7. 支持iframe
  8. 支持wBox拖拽功能
  9. ESC键，或者在背景上双击即可关闭wBox
  10. Class为wBox_close点击可以关闭wBox，无论是组装的html，还是隐藏的html，甚至于iframe的内容中的.wBox_close

查看wBox代码实例wBox1.0下载

"wBox"已有168条评论
    cf3b5：

    请教一下，如何在iframe里头关闭wbox的对话框？我知道.wBoxClose的元素的click被绑定了关闭动作，但是如果我需要由iframe里头的js来调用关闭怎么弄？比如iframe里头的ajax提交成功后自动关闭对话框？

    2010年03月09日 18:33 回复 引用

    断桥残雪：

    可以使用callback函数进行,模拟点击.wBoxClose的元素

    2010年03月09日 19:42 回复 引用

    saadas：

    你好、、请教一下、、我怎么获取弹出层里面输入框的值呢 、、、

    2010年03月24日 23:46 回复 引用

    断桥残雪：

    不知道你说的是iframe中的，还是div中的，div直接用$

    2010年03月25日 01:53 回复 引用

    w3ccss：

    您好，请问一下，怎样才能自定义图片的title呢？

    2010年03月25日 23:59 回复 引用

    kkk：

    压缩包损坏？？

    2010年03月30日 21:09 回复 引用

    断桥残雪：

    我下载的可以使用啊~请使用Firefox下载试试

    2010年03月30日 21:24 回复 引用

    kevin：

    我用IE8，弹窗后浏览器最底下有部分没挡住，firefox下没事。

    2010年03月31日 20:45 回复 引用

    zero：

    我在回调函数中往隐藏的DIV中动态添加HTML 但是却发现要调用两次才能显示添加的值 请问是什么原因?

    2010年04月03日 12:45 回复 引用

    zero：

    另外如果想用button而不是用 ‘a’ 来呼出WBOX应该怎么做呢? `

    2010年04月03日 12:46 回复 引用

    断桥残雪：

    就像选择a一样选择到button就可以啦

    2010年04月03日 17:15 回复 引用

    逸风飘扬：

    我使用你的WBOX建立文档..但是
    使用html属性无法正确的导入内容

    但是在本地完全可以显示
    在服务器上就无法显示了…这个是怎么会事?

    2010年04月20日 08:24 回复 引用

    逸风飘扬：

    使用如下语句
    在本地 file://开头则正常
    $(’#PostMyInfo’).wBox({drag:true,html:StrPost,title:’需求提交’});

    而在服务器上
    FF下无法显示内容
    傲游无法显示内容
    世界之窗无法显示内容
    FF无法显示内容

    2010年04月20日 08:29 回复 引用

    逸风飘扬：

    我将
    102行 直接改写成
    else {con.html(YQ.html);}afterHandleClick();return false;
    取消的 IFRAME 和 灯箱操作,内容正常赋值…
    至于具体原因.请告知.

    2010年04月20日 08:40 回复 引用

    断桥残雪：

    这个问题我没有碰到过，能不能把你服务器的访问地址给我，我去看看代码再下结论

    2010年04月20日 16:37 回复 引用

    逸风飘扬：

    http://www.kkit.net
    这个是地址

    另外…你的插件 似乎不能在 IE 6下执行.

    2010年04月20日 17:23 回复 引用

    断桥残雪：

    网站打不开，太慢了

    2010年04月21日 02:49 回复 引用

    jackusc：

    不能拖动啊。要是能拖动就更好了。
    还有滚动窗口的时候，弹窗最好不动，现在这个一滚动弹窗也随着滚动了。
    遮照层在ie8下面确实有点问题。
    下面有一块没有遮住。
    请作者把bug再研究下！

    2010年04月26日 21:47 回复 引用

    断桥残雪：

    可以拖动的，最近太忙了~呵呵~没有空整呢~

    2010年04月26日 22:47 回复 引用

    basstk：

    jquery1.4.2.js与我网页中的其他jquery库冲突,我创建一个新的别名用以在接下来的库中使用jQuery对象也不行,怎么解决.,希望楼主帮忙,感激不尽!

    2010年05月14日 17:52 回复 引用

    断桥残雪：

    改一下wBox最后的一行jQuery为你改的名字就可以了~

    2010年05月14日 20:50 回复 引用

    云飞扬：

    @逸风飘扬
    IE6先不能遮盖

    2010年05月29日 03:51 回复 引用

    xfeng：

    在加上Confirm和alert把 那样就更好了。

    2010年05月29日 05:23 回复 引用

    infoseek：

    你好，非常感谢你的代码，我用的是wbox的ajax载入功能，但是我向在wbox的ajax加载完毕之后，再载入jqzoom函数，请问怎么知道wbox加载完毕了呢？谢谢

    2010年06月21日 17:11 回复 引用

    断桥残雪：

    可以使用wBox的callback函数

    2010年06月21日 17:16 回复 引用

    top5：

    有bug
    var wBox = $(”#wbox1″).wBox({ title: “XXX”, requestType: “iframe”, iframeWH: { width: 910, height: 350 }, target: “ViewDetail.aspx?id=” + id });
    实际弹出尺寸为”height: 718px; width: 893px;

    2010年06月21日 22:21 回复 引用

    断桥残雪：

    哦，假如你设置了iframeWH，则优先按照设置的来给iframe加宽高

    2010年06月21日 23:35 回复 引用

    top5：

    我并不需要#wbox1
    只要使用wbox弹出一个iframe的层
    wBox({ title: “XXX”, requestType: “iframe”, iframeWH: { width: 910, height: 350 }, target: “ViewDetail.aspx?id=” + id });
    怎么做？

    2010年06月22日 00:46 回复 引用

    top5：

    我想要每个按钮显示不同的内容

    2010年06月22日 00:48 回复 引用

    top5：

    现在我是用这样的方式传参的
    function divShow(id) {
    var wBox = $(”#wbox1″).wBox({ title: “汽车美眉”, requestType: “iframe”, iframeWH: { width: 910, height: 350 }, target: “ViewDetail.aspx?id=” + id });
    wBox.showBox();
    };

    2010年06月22日 00:49 回复 引用

    top5：

    help如上

    2010年06月22日 18:26 回复 引用

    top5：

    十万火急，我的程序就差这一步了，谢谢了

    2010年06月22日 18:49 回复 引用

    fifsky：

    快速移动的时候还是很容易丢失窗体，这点需要加强，最好用个定时器来检查鼠标的位置！

    2010年06月28日 01:41 回复 引用

    小汽车：

    wbox用起来的确不错
    不过个人感觉有一点不太方便，就是关于窗口大小的定义
    如果不是iframe，在代码上就不能方便的定义。
    如果是iframe，在内容比较多的时候，height也不好用。会让窗口变的很长。所以我将81行改成了newH = Math.min(newH, newH = _this.YQ.iframeWH.height);

    感觉把全部的Size的定义，统一成属性，会比较方便一些。

    2010年07月14日 01:55 回复 引用

    小汽车：

    @top5
    跟我遇到的问题一样

    我将81行改成了newH = Math.min(newH, newH = _this.YQ.iframeWH.height);

    这样就能定义iframe的高度了

    2010年07月14日 01:56 回复 引用

    断桥残雪：

    高度的确是个烦人的事情。有空升级一下~

    2010年07月14日 01:59 回复 引用

    Gemsking：

    6#说的问题（回调函数中往隐藏的DIV中动态添加HTML 但是却发现要调用两次才能显示添加的值）确实存在，请问是什么原因

    2010年07月28日 00:37 回复 引用

    xd：

    cf3b5 :请教一下，如何在iframe里头关闭wbox的对话框？我知道.wBoxClose的元素的click被绑定了关闭动作，但是如果我需要由iframe里头的js来调用关闭怎么弄？比如iframe里头的ajax提交成功后自动关闭对话框？

    楼主能帮忙回答一下吗？

    2010年08月09日 16:31 回复 引用

    457233665：

    iframe 方式时，loading。gif图片显示不出来 ajax方式时能显示，IE8下大小设置不正确，无法很好的拖动

    2010年08月09日 23:47 回复 引用

    smart：

    效果不错。。。希望能还出几个背景样式。。
    能不能弹出一个框后后背景网页上的内容还可以操。不变灰。。请指教

    2010年08月12日 01:02 回复 引用

    初学jquery：

    嗯。蛮不错的。以前一直用jQueryAlert。其drag居然还要挂载jquery.ui.draggable.js才行。（http://abeautifulsite.net/blog/2008/12/jquery-alert-dialogs/）
    楼主可否再扩展一下，像jQueryAlert的提示框,有“确认”“取消”按钮等。

    2010年08月16日 23:12 回复 引用

    断桥残雪：

    最近挺忙的，有空就整整

    2010年08月16日 23:38 回复 引用

    胡汉三：

    能不能 固定弹出层，必须点击关闭按钮的时候才能关闭，
    现在是按Esc键和双击背景就可以关闭弹出。

    2010年09月03日 00:37 回复 引用

    断桥残雪：

    暂时不支持固定功能，假如背景参数设置为false，就不存在背景，双击也就不关闭了

    2010年09月03日 00:44 回复 引用

    captain：

    你好，
    使用方法：
    $(”#isFrame”).wBox({requestType:”iframe”,iframeWH:{width:800,height:400},target:”../TestPage.aspx?id=’20′”});

    在TestPage.aspx.cs里使用string id = Request.QueryString["id"]方法取不到id的值，请问怎么解决。

    2010年09月06日 00:47 回复 引用

    captain：

    还有一个问题就是如何在回调函数中关闭这个弹出的层（用iframe加载一个页面的情况），谢谢

    2010年09月06日 05:09 回复 引用

    断桥残雪：

    iframe的dom操作请参考下文：http://www.js8.in/463.html

    2010年09月06日 16:57 回复 引用

    captain：

    @断桥残雪
    传参取不到值的情况呢？是怎么回事

    2010年09月06日 17:03 回复 引用

    断桥残雪：

    @captain
    这个没有碰到过，可以把代码贴上来看看

    2010年09月06日 17:06 回复 引用

    captain：

    事实上是这样的，我在做一个项目，点击一个功能的时候，我需要对其进行权限验证。我的做法是弹出一个层输入用户名、密码，核对正确之后关闭当前弹出的层根据传入的参数跳转到参数据确定的相关页面。

    2010年09月06日 17:10 回复 引用

评论分页 1 2 3 4
文明发言，你好我也好
正在提交,请稍后...
♦▐返回顶部