jBox 是一款基于 jQuery 的多功能对话框插件，有alert警告框、confirm确认框和prompt输入对话框等，并且兼容 IE6+、Firefox、Chrome、Safari、Opera 等主流浏览器。

查看演示

下载资源：

686

次 下载资源

下载积分：

26

积分

引入jQuery和jBox相关插件

// 或

演示一：调用HTML var info = 'jBoxHTML内容调用';

$.jBox.info(info);

演示二：调用某个div的内容，并且弹出层附带底部文字 // 显示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 // 用iframe显示http://www.sucaihuo.com的内容，并设置了标题、宽与高、按钮

$.jBox("iframe:http://www.sucaihuo.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);

演示六：prompt对话提示框 var html = "

";

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 });

更多jBox演示效果，请看演示代码讲解。 参数

描述

默认值

$.jBox(content, options);

content 可以是string或json。当是string时，需要加上前缀标识(html:、id:、get:、post:、iframe:)，如果没有加标识，系统会自动加上html:，具体请看应用例子。当是json时，表示一个或多个状态，每个状态的默认值为 $.jBox.stateDefaults。 options　[可选] (json) 　　　└ 其它参数选项，默认值为 $.jBox.defaults。

-

$.jBox.setDefaults(configs);

设置全局设置，请参考 demo.js 里的使用。

-

$.jBox.getBox();

获取最前面打开的窗口jQuery对象。

-

$.jBox.getIframe(jBoxId);

获取最前面打开的或指定ID的窗口里的 iframe jQuery对象。(方便与iframe的交互)

-

$.jBox.getContent();

获取最前面打开的窗口的内容html。

-

$.jBox.setContent(content);

设置最前面打开的窗口的内容html。

-

$.jBox.getState(stateNmae);

获取最前面打开的窗口可见状态内容。(content为多状态下)

-

$.jBox.getStateName();

获取最前面打开的窗口可见状态的名称。(content为多状态下)

-

$.jBox.goToState(stateName, stateContent);

显示最前面打开的窗口的指定状态，并可设置状态内容。(content为多状态下)

-

$.jBox.nextState(stateContent);

显示最前面打开的窗口的下一个状态，并可设置状态内容。(content为多状态下)

-

$.jBox.prevState(stateContent);

显示最前面打开的窗口的上一个状态，并可设置状态内容。(content为多状态下)

-

$.jBox.close(token);

关闭最前面打开的窗口，token可以是指定jBox的ID或布尔值，如果是true显示关闭所有已打开的窗口。

-

$.jBox.closeTip();

关闭提示(由 $.jBox.tip() 打开的)。

-

$.jBox.closeMessager();

关闭提示(由 $.jBox.messager() 打开的)。

-