jQuery的日期选择器不会在页面

-1

我试图使用jQuery的日期选择器工作（一这里https://jqueryui.com/datepicker/#default显示）在我的网页。但它确实不起作用！当我点击文本框时，显示任何日历。jQuery的日期选择器不会在页面

这是我的网页代码：

<html> 
<head> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
<link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css"> 
<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 

<script> 
$(function() { 
$("#datepicker").datepicker(); 
}); 
</script> 

    <title>Dashboard</title> 
<!-- Bootstrap Core CSS --> 
<link href="css/bootstrap.min.css" rel="stylesheet"> 

<!-- MetisMenu CSS --> 
<link href="css/metisMenu.min.css" rel="stylesheet"> 

<!-- Timeline CSS --> 
<link href="css/timeline.css" rel="stylesheet"> 

    <!-- Custom CSS --> 
    <link href="css/startmin.css" rel="stylesheet"> 

    <!-- Morris Charts CSS --> 
    <link href="css/morris.css" rel="stylesheet"> 

    <!-- Custom Fonts --> 
    <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css"> 

</head> 
<body> 


    <!-- Page Content --> 
    <div id="page-wrapper"> 
     <div class="container-fluid"> 

      <div class="row"> 
       <div class="col-lg-12"> 
        <h1 class="page-header">Reports e stampe</h1> 
       </div> 
      </div> 

     <form method="post" action="page1.php" target="_blank"> 
      <p>Date: <input type="text" id="datepicker"></p> 
     </form> 
     </div> 
    </div> 

    </div> 

<!-- jQuery --> 
<script src="js/jquery.min.js"></script> 

<!-- Bootstrap Core JavaScript --> 
<script src="js/bootstrap.min.js"></script> 

<!-- Metis Menu Plugin JavaScript --> 
<script src="js/metisMenu.min.js"></script> 

<!-- Custom Theme JavaScript --> 
<script src="js/startmin.js"></script> 

</body> 
</html>

谢谢您的帮助！

来源

2016-11-10 Massimiliano Militello

问题寻求帮助的代码必须**包括最短码**要重现**在问题本身**最好在[堆栈摘录]（https://stackoverflow.blog/2014/09/introduction-runnable-javascript-css-and-html-code-snippets /）或[JSFiddle]（https://jsfiddle.net/）。请参阅如何创建[最小，完整和可验证示例]（http://stackoverflow.com/help/mcve）。 – paolobasso

您是否在控制台中发现任何错误？ – MCMXCII

你有什么错误消息？ – Benyi

我看到你的jQuery包括两次（在头部和底部）。这肯定会成为问题。首先要尝试的是删除最后一个jQuery引用。

下一步将所有脚本引用和代码转移到以提高页面加载性能页面最底部一个重构但是这并不是严格把你的问题，只是一个改进。

编辑

现在我们知道过去的提法是这个问题，我会写，你应该如何对特定页面上处理脚本better performance。请注意，我将所有脚本移动到最底部。

<html> 
<head> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
    <link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css"> 

    <title>Dashboard</title> 
    <!-- Bootstrap Core CSS --> 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 

    <!-- MetisMenu CSS --> 
    <link href="css/metisMenu.min.css" rel="stylesheet"> 

    <!-- Timeline CSS --> 
    <link href="css/timeline.css" rel="stylesheet"> 

    <!-- Custom CSS --> 
    <link href="css/startmin.css" rel="stylesheet"> 

    <!-- Morris Charts CSS --> 
    <link href="css/morris.css" rel="stylesheet"> 

    <!-- Custom Fonts --> 
    <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css"> 

</head> 
    <body> 

    .... HTML CONTENT 

    <!-- jQuery --> 
    <script src="js/jquery.min.js"></script> 

    <!-- jQuery UI --> 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 

    <!-- Bootstrap Core JavaScript --> 
    <script src="js/bootstrap.min.js"></script> 

    <!-- Metis Menu Plugin JavaScript --> 
    <script src="js/metisMenu.min.js"></script> 

    <!-- Custom Theme JavaScript --> 
    <script src="js/startmin.js"></script> 

    <script> 
    $(function() { 
     $("#datepicker").datepicker(); 
    }); 
    </script> 

    </body> 
</html>

来源

2016-11-10 17:52:22

谢谢！它只是删除最后一个jQuery引用 –

jQuery的日期选择器不会在页面

回答

相关问题