1.引入文件:   使用前需包含以下jquery.js、bgiframe.js、weebox.js、wee.css文件

2.基本用法举例如下:

<script type="text/javascript">
$.weeboxs.open('#testbox', {
title: 'hello world',
width:400,
height: 200
}); $.weeboxs.open('The operation failed.',{
onopen:function(){
alert('opened!');
},
onclose:function(){
alert('closed!');
},
onok:function(){
alert('ok');
$.weeboxs.close();
}
}); $.weeboxs.open('/modules/test/testsession.php', {
contentType:'ajax'
}); $.weeboxs.open('hello world');
$.weeboxs.open('The operation failed.',{type:'error'});
$.weeboxs.open('The operation failed.',{type:'wee'});
$.weeboxs.open('The operation failed.',{type:'success'});
$.weeboxs.open('The operation failed.',{type:'warning'});
$.weeboxs.open('Autoclosing in 5 seconds.', { timeout: 5 });
</script>

3.以下是默认选项: boxid: null, //设定了此值只后,以后在打开同样boxid的弹窗时,前一个将被自动关闭 boxclass: null, //给弹窗设置其它的样式,用此可以改变弹窗的样式 type: 'dialog', //弹窗类型,目前有dialog,error,warning,success,wee,prompt,box六种 title: '', //弹窗标题 width: 0, //弹窗宽度,不设时,会自动依据内容改变大小 height: 0, //弹窗高度(注意是内容的高度,不是弹窗的高度) timeout: 0, //自动关闭的秒数,设置此值后,窗口将自动关闭 draggable: true,//是否可以拖拽 modal: true, //是否显示遮照 overlay: 75, //遮照透明度 focus: null, //弹窗打开后,焦点移到什么元素上,默认移到取消按钮到 position: 'center',//弹窗打开后的默认为中间,设置为element时,需要设置trager选项, trigger: null, //显示位置的参照元素,为一个元素id showTitle: true,//是否显示标题 showButton: true,//是否显示按钮,包括确定和取消 showCancel: true, //是否显示取消按钮 showOk: true, //是否显示确定按钮 okBtnName: '确定',//"确定"按钮名称 cancelBtnName: '取消',//"取消"按钮名称 contentType: 'text',//内容获取方式,目前有三种text,selector,ajax contentChange: false,//为selector时 clickClose: false, //点击不在弹窗上时,是否关闭弹窗 zIndex: 999,//默认弹窗的层 animate: false,//效果显示 onclose: null, //弹窗关闭时触发的函数 onopen: null, //弹窗显示前触发的函数, 此时内容已经放入弹窗中,不过还没有显示出来 onok: null //点击确定按钮触发的函数

疑难杂症问题:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="weebox/jquery.min.js"></script>
<script type="text/javascript" src="weebox/bgiframe.js"></script>
<script type="text/javascript" src="weebox/weebox.js"></script>
<link type="text/css" rel="stylesheet" href="weebox/weebox.css" />
<script type="text/javascript">
function get()
{
$.weeboxs.open('users.php', {
title:'请选择:',
contentType:'ajax',
width:800,
height:800,
onok:function(box){
var text = "";
var sumEmail = 0;
var textView = "";
$("input[name='invitees[]']:checked").each(function() {
text += ","+$(this).val();
});
//$.post("1.php",{'email':text});
sumEmail = $("input[name='invitees[]']:checked").length;
$("#invite").text('共邀请'+sumEmail+'人,名单如下:');
$("#email").val(text);
textView = text.substr(1).replace(new RegExp(/(,)/g),"; ");
$("#emailView").html(textView);
//window.close();正常情况下这里这样写是可以的,但是有时候竟然要加个参数box才能点
//确定的时候关闭窗口。
box.close();
}
});
}
</script>
</head>
<body>
<!-- 这里用<button onclick="get();return false;"></button>也可以,
但是在IE8,IE9下会直接把表单给提交了。《<button></button>有自动提交表单的特性》 -->
<input type="button" value="点此邀请" onclick="get();">
</body>
</html>

js弹出层插件 -- weebox的更多相关文章

  1. 在Vue中使用layer.js弹出层插件

    layer.js(mobile)是一个小巧方便的弹出层插件,在之前的apicloud项目中被大量使用,但最近对apicloud的IDE.非常不友好的文档和极低的开发效率深感厌烦,决定弃用然后转向Vue ...

  2. jQuery弹出层插件popbox

    都什么年代了,还自己写弹出层插件!是的,①自己写的自己好控制②可定制性高③兼容低版本IE 本插件有以下特性: 样式分离,可定制,纯净无图片 可自定义按钮及按钮的样式.点击事件 可指定选择器选择页面元素 ...

  3. Jquery学习之路(三) 实现弹出层插件

    弹出层的应用还是比较多的,登陆,一些同页面的操作,别人的总归是别人的,自己的才是自己的,所以一直以来想写个弹出层插件.不多废话,直接开始吧! 不想看可以在这里直接下载源码xsPop.zip 1:遮罩层 ...

  4. 写了一个jquery的 弹出层插件。

    下载地址:http://pan.baidu.com/s/1eQ26CMm ps:ajax加载做的,要有环境才能正常运行哦! //这是一个以ajax加载显示弹出层插件  参数(option): widt ...

  5. js弹出层

    js弹出层 1.div附近显示 <div id="message"></div> $().delay().hide(); 2.遮罩层 表单提交后遮住页面,等 ...

  6. 效果非常好的 Jquery弹出层插件 jQuery Sweet alert

    介绍款交互性非常不错的jquery弹出层插件,支持消息提示.错误提示.确认框提示等. 交互式体验感非常不错,比如咱们现在体验非常不错的微信支付.支付宝等完成后的效果. 不过本插件至少支持IE9+ Jq ...

  7. layer/layui弹出层插件bug

    <button class="layui-btn" lay-submit lay-filter="formDemo" id="layui-btn ...

  8. 网站开发常用jQuery插件总结(二)弹出层插件Lightbox_me

    网站开发过程中,为了增加网站交互效果,我们有时需要在当前页面弹出诸如登陆.注册.设置等窗口.而这些窗口就是层,弹出的窗口就是弹出层.jQuery中弹出层插件很多,但有些在html5+css3浏览器下, ...

  9. 网站开发常用jQuery插件总结(二)弹出层插件Lightbox

    网站开发过程中,为了增加网站交互效果,我们有时需要在当前页面弹出诸如登陆.注册.设置等窗口.而这些窗口就是层,弹出的窗口就是弹出层.jQuery中弹出层插件很多,但有些在html5+css3浏览器下, ...

随机推荐

  1. sqlserver access 多数据库操作

    今天搞了一天的事情, 更新 ACCESS 數據庫 ,要從  SQL SERVER 2008數據庫中  查詢資料.沒找到資料 只能自己做了. 首先查找一下 ,如何 用SQL  語句 select *   ...

  2. 降维(一)----说说主成分分析(PCA)的源头

    降维(一)----说说主成分分析(PCA)的源头 降维系列: 降维(一)----说说主成分分析(PCA)的源头 降维(二)----Laplacian Eigenmaps --------------- ...

  3. hdu 4751

    一道很简单的题,不过在比赛的时候没有写出来: 刚刚看到这个题,我以为是一个图论题,后来发现其实就是一个暴力的题: 用bfs,因为一个人与他不认识的人肯定不会在一个集合,如果判断出现冲突则分配失败,否则 ...

  4. 两台CISCO2691测试静态路由汇总,浮动静态路由和负载分担静态路由配置

    Dynagen的配置文件内容: #Lab - autostart = False [localhost] [[]] ram = image = C:\Program Files (x86)\Dynam ...

  5. C++内存管理(超长,例子很详细,排版很好)

    [导语] 内存管理是C++最令人切齿痛恨的问题,也是C++最有争议的问题,C++高手从中获得了更好的性能,更大的自由,C++菜鸟的收获则是一遍一遍的检查代码和对C++的痛恨,但内存管理在C++中无处不 ...

  6. delphi非IE内核浏览器控件TEmbeddedChrome下载|TEmbeddedChrome代码

    下载地址: 点击下载 代码示例: 在TForm的oncreate方法中写入一些代码 procedure TForm1.FormCreate(Sender: TObject); begin Chromi ...

  7. tar 解压命令

    1.tar.gz文件的解压 tar zxvf  *.tar.gz 2.bz2属性的解压 tar jxvf  *.bz2

  8. 性能量化之cpu

    系统现在很慢”似乎是对系统的性能最常用的抱怨了,但究竟慢到什么程度,如何来界定慢,可能需要对性能进行量化,对于OS来说,大致主要分为cpu,内存,磁盘,网络等组件,对这些维度的性能量化,不但可以更准确 ...

  9. bzoj2426

    稍微列个式子就知道是贪心 ..] of longint; m,b,h0,n,i,p,j,x,ans,s:longint; procedure swap(var a,b:longint); var c: ...

  10. 【转】Xcode7.1环境下上架iOS App到AppStore 流程 -- 不错!!

    原文网址:http://www.jianshu.com/p/a8bd16be122f 1.官网地址 Apple Developer 地址:https://developer.apple.com/mem ...