bootbox api
bootbox是boostrap集成的弹窗,基本能完成后台系统的需求,下面是一些使用方法
1.bootbox.alert
bootbox.alert使用方法主要有三种
直接传内容
bootbox.alert('弹窗信息')
传对象
/*
@ message 弹窗的信息,必须要有的属性
@ callback 点击确定的回调函数
*/ bootbox.alert({
message:'弹窗信息',
callback:function(){
console.log('点击了确定');
}
})
效果如下
2.bootbox.confirm
/*
@ message 弹窗的信息,必须要有的属性
@ callback 点击弹窗按钮的回调函数,确定传的value为true,取消为fasle,
@ buttons 按钮的信息
*/
bootbox.confirm({
message:'弹窗信息',
callback:function (value) {
console.log(value)
}
})
bootbox.confirm({
message:'弹窗信息',
callback:function (value) {
console.log(value)
},
buttons:{
confirm:{
confirm:'确认按钮',
className:'btn-primary'
},
cancel:{
confirm:'取消按钮',
className:'btn-default'
}
}
})
3.bootbox.prompt
效果过于逗B,不过多讨论
bootbox.prompt({
title: '弹窗标题',
callback: function(value) {
console.log('你输入的内容为' + value)
}
})
4.bootbox.dialog
以上三个方法最后都是通过转换参数调用dialog的(转换的方法写的挺好的,有心情的可以看看)
bootbox.dialog({
message: "弹窗内容",
title: "弹窗标题",
buttons: {
Cancel: {
label: "取消",
className: "btn-default",
callback: function () {
console.log("点击了取消");
}
}
, OK: {
label: "OK",
className: "btn-primary",
callback: function () {
console.log("点击了确定");
}
}
}
});
结束语:
boostrap的这套弹窗,简单实现了基本的交互,但是遇到复杂的交互的话(点击按钮前做些事情,失败不关闭弹窗,点击取消和弹窗右上角的x是调用不同的事件....),还是自己写一套吧~
bootbox api的更多相关文章
- JS组件系列——Bootstrap寒冬暖身篇:弹出框和提示框效果以及代码展示
前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...
- Bootstrap:弹出框和提示框效果以及代码展示
前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的 ...
- Bootstrap篇:弹出框和提示框效果以及代码展示
前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你 ...
- kendoWindow 与 bootbox 冲突,显示层次问题
今天在使用bootbox做弹出提示遇到些麻烦,由于使用kendoWindow先弹出数据输入窗口, 然后在检核输入时,又用bootbox做为提示窗口,这下悲剧了,后弹出的bootbox窗口总是在kend ...
- bootbox上的浮层弹出如何加上datepicker
bootbox和datepicker都是插件,我想要做的需求大致长这样: 我希望使用bootbox弹出的对话框中能弹出一个截止时间的选择框,这个选择框使用datepicker来做. 看了下这个帖子: ...
- arcgis api for javascript 学习(七) 调用发布地图信息,并将地图属性信息输出到Excel表格---进阶版
我们在arcgis api for javascript 学习(三)已经学习到了关于调用地图信息进行属性输出的问题,不过通过代码我们实现后会发现还是有一些小瑕疵的,比如我们只能单个数据属性的输出,如果 ...
- arcgis api for javascript 学习(三) 调用发布地图信息,并将地图属性信息输出到Excel表中
吐血推荐:网上搜了很久关于webgis地图属性表输出到Excel表,并没能找到相关有价值的信息,在小白面前,这就是一脸懵x啊!网上要么是关于前端如何在页面上直接导出excel,和webgis半毛钱关系 ...
- 干货来袭-整套完整安全的API接口解决方案
在各种手机APP泛滥的现在,背后都有同样泛滥的API接口在支撑,其中鱼龙混杂,直接裸奔的WEB API大量存在,安全性令人堪优 在以前WEB API概念没有很普及的时候,都采用自已定义的接口和结构,对 ...
- 12306官方火车票Api接口
2017,现在已进入春运期间,真的是一票难求,深有体会.各种购票抢票软件应运而生,也有购买加速包提高抢票几率,可以理解为变相的黄牛.对于技术人员,虽然写一个抢票软件还是比较难的,但是还是简单看看123 ...
随机推荐
- Sqoop处理Clob与Blob字段
[Author]: kwu Sqoop处理Clob与Blob字段,在Oracle中Clob为大文本.Blob存储二进制文件. 遇到这类字段导入hive或者hdfs须要特殊处理. 1.oracle中的測 ...
- 和S5933比较起来,开发PLX9054比较不幸,可能是第一次开发PCI的缘故吧。因为,很多PCI的例子都是对S5933,就连微软出版的《Programming the Microsoft Windows Driver Model》都提供了一个完整的S5933的例子。 在这篇有关DDK的开发论文里。
和S5933比较起来,开发PLX9054比较不幸,可能是第一次开发PCI的缘故吧.因为,很多PCI的例子都是对S5933,就连微软出版的<Programming the Microsoft Wi ...
- uva 10891 Game of Sum(区间dp)
题目连接:10891 - Game of Sum 题目大意:有n个数字排成一条直线,然后有两个小伙伴来玩游戏, 每个小伙伴每次可以从两端(左或右)中的任意一端取走一个或若干个数(获得价值为取走数之和) ...
- PHP - 继承 - 子类使用父类方法
<?php class ShopProduct { private $FirstName; private $LastName; private $Title; private $Price; ...
- 动态规划---最长上升子序列问题(O(nlogn),O(n^2))
LIS(Longest Increasing Subsequence)最长上升子序列 或者 最长不下降子序列.很基础的题目,有两种算法,复杂度分别为O(n*logn)和O(n^2) . ******* ...
- ZOJ 2968 Difference Game 【贪心 + 二分】
题意: 有Ga.Gb两堆数字,初始时两堆数量相同.从一一堆中移一一个数字到另一一堆的花费定义为两堆之间数 量差的绝对值,初始时共有钱C.求移动后Ga的最小小值减Gb的最大大值可能的最大大值. 思路: ...
- POJ 1458 最长公共子序列 LCS
经典的最长公共子序列问题. 状态转移方程为 : if(x[i] == Y[j]) dp[i, j] = dp[i - 1, j - 1] +1 else dp[i, j] = max(dp[i - 1 ...
- mojo 接口返回键值对的json格式
my $c = shift; use DBI; my %hash=(); my $dbUser='zabbix'; my $user="root"; my $passwd=&quo ...
- 基于visual Studio2013解决C语言竞赛题之0419误差控制
题目 解决代码及点评 /************************************************************************/ /* 19 ...
- Android的BUG(一) - HTML 5 播放streaming video造成卡住的问题
这个bug,是google自带的问题. 和见到的诸多android的疑难问题一样,这又是一个可以归类为 多线程同步/状态机 问题. 问题处在NuPlayer的异步消息的handle中,现象和原因不细说 ...