bootstrap-confirmation按钮提示组件,它类似于js里面确认的功能,界面更加美观。
介绍这个组件之前,可以先来看看引导里面提示框的效果:
1,源码地址
http://ethaizone.github.io/Bootstrap-Confirmation/
2,效果展示
3代码示例
所需引入的js和css
& lt;链接的href=" https://www.yisu.com/zixun/css/bootstrap.css " rel=巴獠縩ofollow”rel="样式表"/比;
& lt;脚本src=" https://www.yisu.com/zixun/js/jquery-1.11.3.js "祝辞& lt;/script>
& lt;脚本src=" https://www.yisu.com/zixun/js/bootstrap.js "祝辞& lt;/script>
& lt;脚本src=" https://www.yisu.com/zixun/js/bootstrap-confirmation.js "祝辞& lt;/script>
之前
,
初始化
& lt;按钮类型="按钮" id=癰tn_submit1”class=癰tn btn-primary”比;
& lt;跨类=" glyphicon glyphicon-remove”aria-hidden=" true "比;
& lt;/span>删除& lt;/button>
之前
js实现代码
& lt;脚本type=" text/javascript祝辞
$(函数(){
$ (' # btn_submit1 ') .confirmation ({
动画:没错,
位置:“顶级”,
标题:“确定要删除吗?”,
btnOkLabel:“确定”,
btnCancelLabel:“取消”,
onConfirm:函数(){
alert("点击了确定”);
},
虚:函数(){
alert("点击了取消”);
}
})
});
& lt;/script>
之前
常用的属性比。如:
btnOkClass:确定按钮的样式;
btnCancelClass:取消按钮的样式;
单例模式:是否只允许出现一个确定框;
劣质冲浪板:当用户点击其他地方的时候是否隐藏确定框;
标题:标题;
位置:放置位置;
onConfirm:确定事件;
虚:取消事件;
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
