jQuery手机移动端模态对话框插件
下载次数:1
文件大小:59.89KB
所需积分:0
QQ联系购买积分:3331653644(1元=10积分)
默认
$('#btn-01').click(function(){
$.dialog({
contentHtml : '<p>我是默认弹出对话框示例展示。我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。</p>'
});
});
自动关闭
$('#btn-01').click(function(){
$.dialog({
autoClose : 2500,
contentHtml : '<p>我是自动关闭的对话框示例展示。</p> <p>我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。</p>'
});
});
无标题
$('#btn-03').click(function(){
$.dialog(
{ showTitle : false,
contentHtml : '<p>我是没有标题的对话框。</p> <p>我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。</p>'
});
});
自定义标题
$('#btn-04').click(function(){
$.dialog({
titleText : '自定义标题',
contentHtml : '<p>我是自定义标题的对话框。</p> <p>我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。</p>'
});
});
Comfirm 类型
$('#btn-05').click(function(){
$.dialog({
type : 'confirm',
contentHtml : '<p>我是confirm类型的对话框。</p> <p>我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。</p>'
});
});
Comfirm 类型, 自定义按钮文字
$('#btn-06').click(function(){
$.dialog({
type : 'confirm',
buttonText : {
ok : '自定义-确定',
cancel : '自定义-取消'
}, contentHtml : '<p>我是confirm类型的对话框。</p> <p>我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。</p>'
});
});
Comfirm 类型, 按钮回调函数
$('#btn-07').click(function(){
$.dialog({
type : 'confirm',
onClickOk : function(){
alert('你点了确定~~');
}, onClickCancel : function(){
alert('你点了取消~~');
}, contentHtml : '<p>我是confirm类型的对话框。</p> <p>我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。</p>'
});
});
Comfirm 类型, 状态回调函数
$('#btn-08').click(function(){
$.dialog({
type : 'confirm',
onBeforeShow : function(){
alert('显示前执行~~')
}, onShow : function(){
alert('显示完成后执行~~')
}, onBeforeClosed : function(){
alert('关闭前执行~~')
}, onClosed : function(){
alert('关闭后执行,可以看页面title是否改变~~');
document.title = '我已经关闭拉!';
}, contentHtml : '<p>我是confirm类型的对话框。</p> <p>我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。我只是用来占位的内容展示,仅仅用来占位撑起提示内容的高度。</p>'
});
});
info 类型
$('#btn-09').click(function(){
$.dialog({
type : 'info',
infoText : '加载中…',
infoIcon : 'images/icon/loading.gif',
autoClose : 2500
});
});
info 类型, HTML创建内容
$('#btn-12').click(function(){
$.dialog({
type : 'info',
contentHtml : '<img class="info-icon" src="images/icon/success.png" alt="操作成功" /><p class="info-text">操作成功</p>',
autoClose : 2500
});
});
info 类型, 更改状态
$('#btn-12').click(function(){
var infoDialog = $.dialog({
type : 'info',
infoText : '加载中…',
infoIcon : 'images/icon/loading.gif'
});
window.setTimeout(function() {
infoDialog.dialog.update({
autoClose : 1500,
infoText : '操作成功',
infoIcon : 'images/icon/success.png'
});
}, 2500);
});
适用浏览器:360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。
0 条评论