bootbox上的浮层弹出如何加上datepicker
bootbox和datepicker都是插件，我想要做的需求大致长这样： 我希望使用bootbox弹出的对话框中能弹出一个截止时间的选择框，这个选择框使用datepicker来做。 看了下这个帖子： http://stackoverflow.com/questions/22009649/how-to-create-a-bootbox-prompt-with-a-bootstrap-datepicker-as-input 难点在于： 1 datepicker这个html是ajax生成的，需要绑定datepicker事件 2 datepicker出来的时间选择器会出现在浮窗后面。 解决代码如下: <script type="text/javascript"> function bindDatePicker() { $("#datepicker").datepicker({ showOtherMonths: true, }); } function createLong(event){ event.preventDefault(); var pid = $("#cur_pid").val(); bootbox.dialog({ message: '<style>.datepicker{z-index: 99999 !important}<\/style>\ <form class="form-horizontal" role="form" id="create_report_form">\ <input type="hidden" name="pid" value="'+ pid +'" />\ <div class="form-group">\ <label class="col-sm-3 control-label no-padding-right" for="form_title"> 标题 </label>\ <div class="col-sm-9">\ <textarea class="form-control" name="title" placeholder="标题"></textarea>\ </div>\ </div>\ <div class="form-group">\ <label class="col-sm-3 control-label no-padding-right">\ 内容 </label>\ <div class="col-sm-9">\ <textarea class="form-control" name="content" placeholder="内容"></textarea>\ </div>\ </div>\ <div class="form-group">\ <label class="col-sm-3 control-label no-padding-right">\ 目标 </label>\ <div class="col-sm-9">\ <textarea class="form-control" name="target" placeholder="目标"></textarea>\ </div>\ </div>\ <div class="form-group">\ <label class="col-sm-3 control-label no-padding-right">\ 截止时间 </label>\ <div class="col-xs-6">\ <div class="input-group input-group-sm">\ <input type="text" id="datepicker" class="form-control hasDatepicker">\ <span class="input-group-addon">\ <i class="icon-calendar"></i>\ </span>\ </div>\ </div>\ </div>\ \<script type="text/javascript">bindDatePicker()\<\/script>\ </form>', title: "创建长期计划", buttons: { "success" : { "label" : "<i class='icon-ok'></i> 提交", "className" : "btn-sm btn-success", "callback": function() { var params = $("#create_report_form").serialize(); $.ajax({ type: "post", dataType: "jsonp", url: "http://api.test/report/create", data: params, jsonp: 'callback', jsonpCallback: 'callbackReportCreate', success: function(data) { if (data.msg == 'ok') { var reports = data.data; location.reload(); } } }); } } } }); } 本文转自轩脉刃博客园博客，原文链接： http://www.cnblogs.com/yjf512/p/3791178.html ，如需转载请自行联系原作者
