这个大概是事件冒泡造成的.

解决办法:

  1 <form id="userForm"  class="form-horizontal">
  2     <input type="hidden"  name="id" id="id" />
  3     <div class="modal-header">
  4         <button type="button" class="close" onclick="base.winClose()">&times;</button>
  5         <h4 class="modal-title" id="myModalLabel">添加用户</h4>
  6     </div>
  7     <div class="modal-body">
  8         <div class="form-group">
  9             <label class="col-sm-2 control-label">用户名:</label>
 10             <div class="col-sm-6">
 11                     <input type="text" class="form-control" id="userName" name="userName" placeholder="请输入名称"  />
 12
 13             </div>
 14         </div>
 15         <div class="form-group">
 16             <label class="col-sm-2 control-label">请选择</label>
 17             <div class="col-sm-6">
 18                 <div class="radio">
 19                     <label>
 20                         <input type="radio" name="sex" value="0" checked> 男
 21                     </label>
 22                 </div>
 23                 <div class="radio">
 24                     <label>
 25                         <input type="radio" name="sex" value="1"> 女
 26                     </label>
 27                 </div>
 28             </div>
 29         </div>
 30         <div class="form-group">
 31             <label class="col-sm-2  control-label" for=test>选择列表</label>
 32             <div class="col-sm-6">
 33                 <select id="test" name="test" class="form-control">
 34                     <option value="">请选择</option>
 35                     <option value="1">1</option>
 36                     <option value="2">2</option>
 37                     <option value="3">3</option>
 38                     <option value="4">4</option>
 39                     <option value="5">5</option>
 40                 </select>
 41             </div>
 42         </div>
 43         <div class="form-group">
 44             <label class="col-sm-2 control-label" for="password">密码:</label>
 45             <div class="col-sm-6">
 46                 <input class="form-control" id="password" name="password" type="password" />
 47             </div>
 48         </div>
 49         <div class="form-group">
 50             <label class="col-sm-2 control-label" for="confirm_password">确认密码:</label>
 51             <div class="col-sm-6">
 52                 <input class="form-control" id="confirm_password" name="confirm_password" type="password" />
 53             </div>
 54         </div>
 55         <div class="form-group">
 56             <label class="col-sm-2 control-label" for="email">E-Mail:</label>
 57             <div class="col-sm-6">
 58                 <input class="form-control" id="email" name="email" />
 59             </div>
 60         </div>
 61         <div class="form-group">
 62             <label class="col-sm-2 control-label" for="phone">手机号码:</label>
 63             <div class="col-sm-6">
 64                 <input class="form-control" id="phone" name="phone" />
 65             </div>
 66         </div>
 67         <div class="form-group">
 68             <label class="col-sm-2 control-label" for="birthday">生日:</label>
 69             <div class="col-sm-6">
 70                 <input class="form-control" id="birthday" name="birthday" />
 71             </div>
 72         </div>
 73         <div class="form-group">
 74              <label class="col-sm-2 control-label">最小和最大文件的大小</label>
 75              <div class="col-sm-6">
 76                  <input type="file" class="form-control" name="fourthFile" />
 77                   <span class="help-block">选择一个pdf文件大小1米和10米之间.</span>
 78              </div>
 79         </div>
 80        <div class="form-group">
 81              <label for="dtp_input1" class="col-md-2 control-label">时间</label>
 82              <div class="input-group date form_datetime col-md-5" data-date-format="dd MM yyyy - HH:ii p" data-link-field="dtp_input1">
 83                 <input class="form-control" size="16" type="text" value="" readonly>
 84                 <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
 85                 <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
 86             </div>
 87             <input type="hidden" id="dtp_input1" value="" />
 88             <script type="text/javascript">
 89                  base.get('.form_datetime').datetimepicker({
 90                     language:  'zh',
 91                     weekStart: 1,
 92                     todayBtn:  1,
 93                     autoclose: 1,
 94                     todayHighlight: 1,
 95                     startView: 2,
 96                     forceParse: 1,
 97                     showMeridian: 1,
 98                     pickerPosition:'top-right'
 99                 }).on('hide', function(event) {
100                     event.preventDefault();
101                     event.stopPropagation();
102                 });
103             </script>
104        </div>
105
106     </div>
107     <div class="modal-footer">
108         <button type="button" class="btn btn-default" onclick="base.winClose()">关闭</button>
109         <button type="button" class="btn btn-primary" onclick="base.addUser()">提交更改</button>
110     </div>
111 </form>

主要就是图中红色部分: 99--> 102行

 1                  base.get('.form_datetime').datetimepicker({
 2                     language:  'zh',
 3                     weekStart: 1,
 4                     todayBtn:  1,
 5                     autoclose: 1,
 6                     todayHighlight: 1,
 7                     startView: 2,
 8                     forceParse: 1,
 9                     showMeridian: 1,
10                     pickerPosition:'top-right'
11                 }).on('hide', function(event) {
12                     event.preventDefault();
13                     event.stopPropagation();
14                 });

参考链接:

https://github.com/uxsolutions/bootstrap-datepicker/issues/50

转载于:https://www.cnblogs.com/cbza/p/6674622.html

bootstrap --- 在 modal中的 datetimepicker 关闭 ,会造成 modal也会被关闭.相关推荐

  1. Bootstrap:关于bootstrap单页面中多Modal的问题

    2019独角兽企业重金招聘Python工程师标准>>> 在单页面中新建用户采用modal而判断添加成功后还采用modal提示成功后右边的滚动条会出来俩条,覆盖整个body的阴影瞬间变 ...

  2. 解决select2在bootstrap的modal中默认不显示的问题

    解决select2在bootstrap的modal中默认不显示的问题 参考文章: (1)解决select2在bootstrap的modal中默认不显示的问题 (2)https://www.cnblog ...

  3. Bootstrap 学习之js插件(模态框(Modal)插件)

    Bootstrap 模态框(Modal)插件 模态框(Modal)是覆盖在父窗体上的子窗体.通常,目的是显示来自一个单独的源的内容,可以在不离开父窗体的情况下有一些互动.子窗体可提供信息.交互等. ( ...

  4. Bootstrap开启模态框后对数据处理(标记模态框的开启与关闭状态)

    JS用全局变量标记状态,方法中动态修改全局变量以标记状态是一个重要思想. 需求:组合条件查询数据,查询完之后填充到模态框中,开启模态框,模态框中有组合条件查询,此时查询只需要更新模态框表格数据不需要开 ...

  5. 在Bootstrap模糊框中使用WebUploader的问题及解决方法

    在我毕设项目中有个需求是在Bootstrap模糊框中显示WebUploader的上传按钮,效果如下: 我们直接在Bootstrap的模糊框中插入了上传的组件: 然而实际效果却是当模糊框出现之后,却无法 ...

  6. 基于BootStrap 4.x 中的Flex 实现各种布局

    各种布局,总有一款适合你 基于bootstrap 4.x 中的flex 布局 1.左右结构(左窄右宽) <div class="d-flex flex-row" style= ...

  7. Bootstrap 分页导航中的翻页组件

    分页导航中的翻页 一些简单的网站,比如博客或者杂志网站,希望用更少的标记和样式,来创建简单的"前一页"和"后一页"的翻页导航. Bootstrap中,只需为列表 ...

  8. 最新QT从入门到实战完整版(08.qt中的坐标系-09 信号和槽-点击按钮关闭窗口_)

    最新QT从入门到实战完整版(08.qt中的坐标系-09 信号和槽-点击按钮关闭窗口_) 一.08.qt中的坐标系 二,09 信号和槽-点击按钮关闭窗口_ 来自 一.08.qt中的坐标系 二,09 信号 ...

  9. iview-admin, Modal中poptip的问号黄色图标显示到右边

    iview-admin  Modal对话框底部footer中使用poptip的问号黄色图标显示到右边了,poptip显示整体偏右,如下图所示,好像有点问题,不知如何修改为正常的???? <Mod ...

最新文章

  1. rsa证书ssh登陆服务器
  2. 算法笔记_183:历届试题 九宫重排(Java)
  3. SQL SERVER2008 镜像
  4. c语言猜数字游戏用while,【C语言基础】有趣的猜数字游戏。(while循环,if语句,switch语句)...
  5. 服务器扫描出漏洞怎么才会被攻击_维护企业服务器安全,你需要做到这8点
  6. boost::graph::distributed::mpi_process_groupboost::graph::用法的测试程序
  7. winform datagridview 打印
  8. csdn上修改字体的颜色
  9. AjaxControlToolkit的使用
  10. STM32 - CubeMX 的使用实例详细(01)- STM32F103的配置 - GPIO设定
  11. java的super是什么意思_java中Super到底是什么意思?必须举例说明!
  12. 手机浏览器页面知识收集(转)
  13. 解决Firefox火狐打不开Axure原型图
  14. 设计原则Python
  15. 爽!Android模拟器可以运行ARM应用了
  16. 用Python完成毫秒级抢单,助你秒杀淘宝大单
  17. 设计模式之观察者模式详解(附应用举例实现)
  18. 计算机音乐数字谱抖音,抖音计算器谱子有哪些?计算器音乐乐谱大全
  19. 西门子 延时 光控 声控开关 5TG0 211 -1CC1 提高 灵敏度 的方法
  20. 运营商业务系统基于 KubeSphere 的容器化实践

热门文章

  1. 个人IHttpHandler,IHttpModule认识
  2. iOS6 自动布局 入门–Auto Layout(转)
  3. 写个mp3播放器 - flash.media.sound
  4. python中home定义是什么_第48p,什么是函数?,Python中函数的定义
  5. python 判断类是否存在某个属性或方法
  6. kali-linux虚拟机与主机共享文件
  7. 抢红包神器上线,再也不怕抢不到红包了!
  8. Hologres揭秘:如何支持超高QPS在线服务(点查)场景
  9. 打破重重阻碍,Flutter 和 Web 生态如何对接?
  10. html css integrity,HTML5 script 标签的 crossorigin 和integrity属性的作用