jQueryConfirm确认提示框插件
jQuery Confirm是一个用于显示confirm确认提示消息的jquery插件,该插件在使用的时候不需要添加改变原有代码逻辑,只需要在待确认的节点上调用conform,如$(element).confirm(),另外该插件不需要回调方法。
相比传统的confirm方法,该插件使用上方便许多。而且在用户体验上更为友好。
查看实际效果
您确定要单击进入吗?Yes/No
jQuery Confirm插件原理
简而言之,就是通过插件记录下该节点上绑定的单击事件,然后取消原事件绑定。当用户单击时,显示提示内容,如果用户选择确认操作,则触发节点原绑定事件,用户取消,提示内容消失。
用法和文档
$(element).confirm(options)
jquery插件分享
options
参数
类型
是否可选
描述
默认值
msg
String
可选
提示内容
‘Are you sure?’
stopAfter
string
可选
停止事件冒泡
‘never’
wrapper
String
可选
外层包裹
‘<span></span>’
eventType
String
可选
响应时间类型
‘click’
dialogShow
String
可选
对话框小时效果
‘show’
dialogSpeed
String
可选
对话框显示速度
‘fast’
timeout
Integer
可选
延时
0
options.buttons
ok
String
可选
确认按钮
‘Yes’
cancel
String
可选
取消按钮
‘No’
wrapper
String
可选
按钮的外层包装
‘<a href=”#”></a>’
separator
String
可选
按钮之间的分隔符
‘/’
cls
String
可选
按钮的样式
undefined
demo1
// The action.
$('a').click(function() {
alert('click');
return false;
});
// The most simple use.
$('a').confirm();
click me!
demo2
// The action.
$('input[type=button]').click(function() {
$(this).remove();
});
$('input[type=button]').confirm({
msg:'Do you really want to delete this button?',
timeout:3000
});
demo3
// The action.
$('span').mouseover(function() {
$(this).html('Here is the offer');
});
$('span').confirm({
msg:'See my interesting offer?',
stopAfter:'ok',
eventType:'mouseover',
timeout:3000,
buttons: {
ok:'Sure',
cancel:'No thanks',
separator:'  '
}
});
哦,其实什么也没有!
demo4
$('a').confirm({
timeout:3000,
dialogShow:'fadeIn',
dialogSpeed:'slow',
buttons: {
wrapper:'<button></button>',
separator:'  '

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。