bootstrap实现点击删除按钮弹出确认框的实例代码


Posted in Javascript onAugust 16, 2018

具体代码如下所示:

<%@ page language="java" import="com.student.servlet.*" contentType="text/html; charset=UTF-8"
  pageEncoding="UTF-8"%>
<%@page import="java.util.*" import="com.student.vo.User"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="bootstrap/bootstrap.min.css" rel="external nofollow" />
 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
 <script src="bootstrap/bootstrap.min.js"></script>
</head>
<body>
<script type="text/javascript">
$('#myModal').on('shown.bs.modal', function () {
  $('#myInput').focus()
 })
</script>
<button type="button" class="btn btn-danger" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">删除</button>
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
 <div class="modal-dialog" role="document">
  <div class="modal-content">
   <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
    <h4 class="modal-title" id="exampleModalLabel">确认框</h4>
   </div>
   <div class="modal-body">
    <form>
    <div class="form-group">
      <label for="message-text" class="control-label">确定要删除联系人?</label>
     </div>
    </form>
   </div>
   <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">返回</button>
    <button type="button" class="btn btn-primary">确认</button>
   </div>
  </div>
 </div>
</div>
</body>
</html>

bootstrap实现点击删除按钮弹出确认框的实例代码bootstrap实现点击删除按钮弹出确认框的实例代码

总结

以上所述是小编给大家介绍的bootstrap实现点击删除按钮弹出确认框的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript showModalDialog,open取得父窗口的方法
Mar 10 Javascript
JavaScript 操作键盘的Enter事件(键盘任何事件),兼容多浏览器
Oct 11 Javascript
js函数setTimeout延迟执行的简单介绍
Jul 17 Javascript
jQuery教程 $()包装函数来实现数组元素分页效果
Aug 13 Javascript
js实现图片点击左右轮播
Jul 08 Javascript
Jquery幻灯片特效代码分享--打开页面随机选择切换方式(3)
Aug 15 Javascript
20分钟轻松创建自己的Bootstrap站点
May 12 Javascript
对js中回调函数的一些看法
Aug 29 Javascript
Vue.js创建Calendar日历效果
Nov 03 Javascript
BootStrap的select2既可以查询又可以输入的实现代码
Feb 17 Javascript
vue获取元素宽、高、距离左边距离,右,上距离等还有XY坐标轴的方法
Sep 05 Javascript
Vue项目安装插件并保存
Jan 28 Javascript
浅谈Vue.js路由管理器 Vue Router
Aug 16 #Javascript
layui问题之模拟select点击事件的实例讲解
Aug 15 #Javascript
深入理解Vue router的部分高级用法
Aug 15 #Javascript
JS打印彩色菱形的实例代码
Aug 15 #Javascript
layui点击按钮添加可编辑的一行方法
Aug 15 #Javascript
layui 优化button按钮和弹出框的方法
Aug 15 #Javascript
jQuery实现参数自定义的文字跑马灯效果
Aug 15 #jQuery
You might like
PHP 截取字符串 分别适合GB2312和UTF8编码情况
2009/02/12 PHP
Drupal7中常用的数据库操作实例
2014/03/02 PHP
php中fsockopen用法实例
2015/01/05 PHP
ThinkPHP整合datatables实现服务端分页的示例代码
2018/02/10 PHP
php上传后台无法收到数据解决方法
2019/10/28 PHP
用jquery实现下拉菜单效果的代码
2010/07/25 Javascript
js鼠标及对象坐标控制属性详细解析
2013/12/14 Javascript
javascript面向对象特性代码实例
2014/06/12 Javascript
全面解析JavaScript中的valueOf与toString方法(推荐)
2016/06/14 Javascript
js轮播图代码分享
2016/07/14 Javascript
js学习笔记之事件处理模型
2016/10/31 Javascript
使用vue.js编写蓝色拼图小游戏
2017/03/17 Javascript
简单实现js进度条加载效果
2020/03/25 Javascript
微信小程序ajax实现请求服务器数据及模版遍历数据功能示例
2017/12/15 Javascript
angularjs中$http异步上传Excel文件方法
2018/02/23 Javascript
layer ui 导入文件之前传入数据的实例
2019/09/23 Javascript
Vue 实现复制功能,不需要任何结构内容直接复制方式
2019/11/09 Javascript
jQuery实现获取多选框的值示例
2020/02/07 jQuery
[02:41]DOTA2亚洲邀请赛小组赛第三日 赛事回顾
2015/02/01 DOTA
python 字典(dict)遍历的四种方法性能测试报告
2014/06/25 Python
Python cookbook(数据结构与算法)从字典中提取子集的方法示例
2018/03/22 Python
Python面向对象之继承和组合用法实例分析
2018/08/27 Python
python实现Zabbix-API监控
2018/09/17 Python
对pandas的行列名更改与数据选择详解
2018/11/12 Python
Python Multiprocessing多进程 使用tqdm显示进度条的实现
2019/08/13 Python
Python3搭建http服务器的实现代码
2020/02/11 Python
CSS3按钮鼠标悬浮实现光圈效果源码
2016/09/11 HTML / CSS
HTML5的结构和语义(5):内嵌媒体
2008/10/17 HTML / CSS
Snapfish英国:在线照片打印和个性化照片礼品
2017/01/13 全球购物
巴西化妆品商店:Lojas Rede
2019/07/26 全球购物
大学生的四年学习自我评价
2013/12/13 职场文书
家长给幼儿园的表扬信
2014/01/09 职场文书
《灰椋鸟》教学反思
2014/04/27 职场文书
2014教师年度工作总结
2014/11/10 职场文书
党员自评材料范文
2014/12/17 职场文书
《将心比心》教学反思
2016/02/23 职场文书