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 相关文章推荐
[IE&amp;FireFox兼容]JS对select操作
Jan 07 Javascript
在页面上点击任一链接时触发一个事件的代码
Apr 07 Javascript
导入extjs、jquery 文件时$使用冲突问题解决方法
Jan 14 Javascript
javascript实现字符串反转的方法
Feb 05 Javascript
微信小程序 设置启动页面的两种方法
Mar 09 Javascript
Vue2.0设置全局样式(less/sass和css)
Nov 18 Javascript
微信小程序页面生命周期详解
Jan 31 Javascript
使用Angular CLI生成路由的方法
Mar 24 Javascript
Angular中sweetalert弹框的基本使用教程
Jul 22 Javascript
微信公众号H5支付接口调用方法
Jan 10 Javascript
解决layui弹框失效的问题
Sep 09 Javascript
vue点击按钮实现简单页面的切换
Sep 08 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中路径问题的解决方案
2006/10/09 PHP
基于Laravel 多个中间件的执行顺序详解
2019/10/21 PHP
Yii 框架使用Forms操作详解
2020/05/18 PHP
JS获取键盘上任意按键的值(实例代码)
2013/11/12 Javascript
Jquery实现控件的隐藏和显示实例
2014/02/08 Javascript
javascript读取Xml文件做一个二级联动菜单示例
2014/03/17 Javascript
使用text方法获取Html元素文本信息示例
2014/09/01 Javascript
js使用setTimeout实现定时炸弹的方法
2015/04/10 Javascript
Angular 应用技巧总结
2016/09/14 Javascript
Validform表单验证总结篇
2016/10/31 Javascript
纯JS单页面赛车游戏制作代码分享
2017/03/03 Javascript
JavaScript中立即执行函数实例详解
2017/11/04 Javascript
Vue 2.5.2下axios + express 本地请求404的解决方法
2018/02/21 Javascript
JS遍历DOM文档树的方法实例详解
2018/04/03 Javascript
vue通过style或者class改变样式的实例代码
2018/10/30 Javascript
vue地址栏直接输入路由无效问题的解决
2018/11/15 Javascript
Vue实现一个图片懒加载插件
2019/03/11 Javascript
微信小程序聊天功能的示例代码
2020/01/13 Javascript
[46:49]完美世界DOTA2联赛PWL S3 access vs Rebirth 第二场 12.19
2020/12/24 DOTA
Python的一些用法分享
2012/10/07 Python
实例讲解Python编程中@property装饰器的用法
2016/06/20 Python
对python 中re.sub,replace(),strip()的区别详解
2019/07/22 Python
详解torch.Tensor的4种乘法
2020/09/03 Python
一篇文章带你搞定Ubuntu中打开Pycharm总是卡顿崩溃
2020/11/02 Python
python爬虫智能翻页批量下载文件的实例详解
2021/02/02 Python
突袭HTML5之Javascript API扩展5—其他扩展(应用缓存/服务端消息/桌面通知)
2013/01/31 HTML / CSS
canvas 下载二维码和图片加水印的方法
2018/03/21 HTML / CSS
HTML5在微信内置浏览器下右上角菜单的调整字体导致页面显示错乱的问题
2021/01/19 HTML / CSS
计算机专业大学生的自我评价
2013/11/14 职场文书
集体婚礼证婚词
2014/01/13 职场文书
中英文求职信范文
2014/01/27 职场文书
广告业务员岗位职责
2014/02/06 职场文书
遗体告别仪式主持词
2014/03/20 职场文书
连锁超市项目计划书
2014/09/15 职场文书
社区党风廉政建设调研报告
2015/01/01 职场文书
2016三八妇女节慰问信
2015/11/30 职场文书