JBox-v2.3修改版
JBox-v2.3修改版 支持 Jquery 1.*的所有版本。
$.jBox()
函数原型:
$.jBox(content, options);
└ 或者 jBox(content, options);
参数说明:
- content (string,json)
└ 可以是string或json。当是string时,需要加上前缀标识(html:、id:、get:、post:、iframe:),如果没有加标识,系统会自动加上html:,具体请看应用例子。当是json时,表示一个或多个状态,每个状态的默认值为 $.jBox.stateDefaults。
- options [可选] (json)
└ 其它参数选项,默认值为 $.jBox.defaults。
备注:如果想手动关闭jBox(不包括下面的tip与messager,它们另有方法),请调用 $.jBox.close(token) 方法。
示例(一):
// 此例省略了前缀html:,前缀标识是不区分大小写的,也可以是HTML: var info = 'jQuery jBox<br /><br />版本:v2.0<br />日期:2011-7-24<br />'; info += '官网:<a target="_blank" href="http://kudystudio.com/jbox">http://kudystudio.com/jbox</a>'; $.jBox.info(info);
示例(二):
// 显示id为id-html的div内部html,同时设置了bottomText $.jBox('id:id-html', { bottomText: '这是底部文字' });
示例(三):
// ajax get 页面ajax.html的内容并显示,例如要提交id=1,则地址应该为 ajax.html?id=1,post:前缀的使用与get:的一样 $.jBox("get:ajax.html");
示例(四):
// 用iframe显示http://www.baidu.com的内容,并设置了标题、宽与高、按钮 $.jBox("iframe:http://www.baidu.com", { title: "百度一下", width: 800, height: 350, buttons: { '关闭': true } });
示例(五):
var content = { state1: { content: '状态一', buttons: { '下一步': 1, '取消': 0 }, buttonsFocus: 0, submit: function (v, h, f) { if (v == 0) { return true; // close the window } else { $.jBox.nextState(); //go forward // 或 $.jBox.goToState('state2') } return false; } }, state2: { content: '状态二,请关闭窗口哇:)', buttons: { '上一步': 1, '取消': 0 }, buttonsFocus: 0, submit: function (v, h, f) { if (v == 0) { return true; // close the window } else { $.jBox.prevState() //go back // 或 $.jBox.goToState('state1'); } return false; } } }; $.jBox(content);
示例(六):
var html = "<div style='padding:10px;'>输入姓名:<input type='text' id='yourname' name='yourname' /></div>"; var submit = function (v, h, f) { if (f.yourname == '') { $.jBox.tip("请输入您的姓名。", 'error', { focusId: "yourname" }); // 关闭设置 yourname 为焦点 return false; } $.jBox.tip("你叫:" + f.yourname); //$.jBox.tip("你叫:" + h.find("#yourname").val()); //$.jBox.tip("你叫:" + h.find(":input[name='yourname']").val()); return true; }; $.jBox(html, { title: "你叫什么名字?", submit: submit });
本文网址:https://www.zztuku.com/index.php/detail-12849.html
转载请声明来自:站长图库 - JBox-v2.3修改版使用声明:
1、本站所有素材,仅限学习交流,请勿用于商业用途。
2、本站资源大多无解压密码,如遇需要解压密码,无特殊说明,均为:zztuku.com
4、本站提供的源码、模板、软件工具等其他资源,均不包含技术服务,请大家谅解!由于资源大多存储在云盘,如出现链接失效请评论反馈。
5、如果素材损害你的权益,请 联系我们 给予处理。
您还没有登录,请 登录 后发表评论!
提示:请勿发布广告垃圾评论,否则封号处理!!