html5自动弹窗 jq,jQuery弹窗对话框插件

这是一款jQuery弹窗对话框插件。该jquery弹窗插件可以用于做提示框,对话框,确认框等,兼容ie8,并提供点击按钮后的回调函数调用方法,非常好用。

使用方法

在页面中引入jquery、jquery.dialog.js和dialog.css文件。

创建一个基本的对话框

一个基本的对话框的调用方法如下。

$.dialog({

content: ''这是对话框的内容'

});

创建消息通知框

消息通知框有3个参数。

message:消息通知框显示的内容。

timeout:多少毫秒后自动关闭。

callback:关闭后的回调函数。

$.sendMsg('Notification Message', 3000, function(){

alert('close')

});

// or

$.sendSuccess('Success Message', 3000, function(){

alert('close')

});

$.sendWarning('Warning Message', 3000, function(){

alert('close')

});

$.sendError('Error Message', 3000, function(){

alert('close')

});

$.sendSuccessToTop('Sticky Success Message', 3000, function(){

alert('close')

});

$.sendWarningToTop('Sticky Warning Message', 3000, function(){

alert('close')

});

创建确认框

$.sendConfirm({

title: 'Confirm Dialog',

msg: 'Are U Sure?',

desc: 'Are U Sure to delete this entry?',

button: {

confirm: 'Okey',

cancel: 'Cancel'

},

onConfirm: function() {

console.log('Confirm');

},

onCancel: function() {

console.log('Cancel');

},

onClose: function() {

console.log('Close');

}

});

配置参数

全局配置参数和默认值如下:

{

id: '',

title: 'Title',

isFixed: true,

hideHeader: false,

hideClose: false,

content: null,

callback: null,

withNoPadding: false,

withNoMinWidth: false,

bgHide: true,

escHide: true

}

对话框的默认配置参数如下:

{

id: 'dialogConfirmBox',

title: 'Confirm',

hideHeader: false,

hideClose: false,

withCenter: false,

withIcon: false,

autoClose: false,

timeout: 3000,

width: null,

noconfirm: false,

msg: '',

desc: '',

content: '',

button: {

confirm: 'Okey', // {text:'Text', href:'#', target:'_blank',behavior:'behavior'}

cancel: 'Cancel', // {text:'Text', href:'#', target:'_blank',behavior:'behavior'}

cancelFirst: false

}

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值