?

這個(gè)大概是事件冒泡造成的.

解決辦法:

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">確認(rèn)密碼：</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">手機(jī)號碼：</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">選擇一個(gè)pdf文件大小1米和10米之間.</span> 78 </div> 79 </div> 80 <div class="form-group"> 81 <label for="dtp_input1" class="col-md-2 control-label">時(shí)間</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()">關(guān)閉</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

?

轉(zhuǎn)載于:https://www.cnblogs.com/cbza/p/6674622.html

總結(jié)

以上是生活随笔為你收集整理的bootstrap --- 在 modal中的 datetimepicker 关闭 ,会造成 modal也会被关闭.的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。