Jquery 模式内的日期和时间选择器和多个链接不工作_Jquery_Twitter Bootstrap_Bootstrap Modal

Jquery 模式内的日期和时间选择器和多个链接不工作

jquery twitter-bootstrap

Jquery 模式内的日期和时间选择器和多个链接不工作,jquery,twitter-bootstrap,bootstrap-modal,Jquery,Twitter Bootstrap,Bootstrap Modal,我想能够有一个日期和时间选择器在一个文本框，但我不能让它工作，我也可以让第一个链接打开，但第二个链接也将打开第一个链接有人能看看我做错了什么吗以下是代码示例：代码主页 <!DOCTYPE html> <html> <head> <title>Bootstrap 3 Modal with remote content</title> <meta name="viewport" content="width=

我想能够有一个日期和时间选择器在一个文本框，但我不能让它工作，我也可以让第一个链接打开，但第二个链接也将打开第一个链接

有人能看看我做错了什么吗

以下是代码示例：

代码主页

<!DOCTYPE html>
<html>
  <head>
    <title>Bootstrap 3 Modal with remote content</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Bootstrap core CSS -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.0/css/bootstrap.css" rel="stylesheet" media="screen">


    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6.2/html5shiv.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/respond.js/1.2.0/respond.js"></script>
    <![endif]-->
  </head>
  <body>
<a data-toggle="modal" class="btn btn-info" href="remotePage.php?id=123" data-target="#myModal">Link 1</a>
<BR><BR>
<a data-toggle="modal" class="btn btn-info" href="remotePage2.php?id=456" data-target="#myModal">Link 2</a>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
        </div><!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<!-- /.modal -->
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.0/js/bootstrap.min.js"></script>

    </body>
</html>


带远程内容的Bootstrap 3模式

远程页面（“remotePage.php”）


引导模式的远程文件
&时代；
情态标题
每一个市政当局都有一股强烈的热情，这股热情是相互关联、相互处置和相互排斥的、相互排斥的、相互协调的、相互分散的、众多超级蝙蝠的
接近
保存更改
$（函数（）{
$（'#datetimepicker1'）。datetimepicker（{}）；
});

*远程页面2只是一些随机文本

将此路径添加到index.php，因为它显示datetimepicker不是一个函数

您是说您为index.php中的按钮2提供的链接吗？文本框datetimepicker1不工作，它应该显示日期和时间选择器，如果我单击按钮1，然后单击按钮2，它仍然会打开按钮1。因此，无论我首先单击哪个链接，它都会为两个按钮打开它。将按钮1的数据目标从myModal1更改为myModal，并且由于您已将myModal2作为按钮2的数据目标，因此您必须创建另一个id为myModal2的模式。当您单击链接1时，控制台中是否会出现任何错误，因为它对我有效然后关闭它并单击链接2，它将向您显示链接1的页面，无论您先单击什么链接，它都将继续显示其他链接的数据/页面。

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>Remote file for Bootstrap Modal</title>  
</head>
<body>
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                 <h4 class="modal-title">Modal title</h4>
            </div>          <!-- /modal-header -->
            <div class="modal-body">
<div id="datetimepicker1" class="input-append date">
     <input data-format="dd/MM/yyyy hh:mm:ss" type="text"></input>
     <span class="add-on"><i data-time-icon="icon-time" data-date-icon="icon-calendar"></i></span>
</div>          
            <p>Excitavit hic ardor milites per municipia plurima, quae isdem conterminant, dispositos et castella, sed quisque serpentes latius pro viribus repellere moliens, nunc globis confertos, aliquotiens et dispersos multitudine superabatur ingenti.</p>
            </div>          <!-- /modal-body -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>          <!-- /modal-footer -->

<!-- DATE AND TIME PICKER -->
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js'></script>
<script src='https://s3-us-west-2.amazonaws.com/s.cdpn.io/2708/bootstrap-datetimepicker.min.js'></script>
<script>$(function() {
  $('#datetimepicker1').datetimepicker({});
});
</script>
<!-- DATE AND TIME PICKER -->

</body>
</html>