Question

我试图使用jQuery datepicker： http://jqueryui.com/datepicker/

有趣的是，我将源代码复制并粘贴到.html文件中并在Chrome中打开。 datepicker不起作用。这是来源：

<!doctype html>
<html lang="en">
    <head>
      <meta charset="utf-8">
      <title>jQuery UI Datepicker - Default functionality</title>
      <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
      <script src="//code.jquery.com/jquery-1.10.2.js"></script>
      <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
      <link rel="stylesheet" href="/resources/demos/style.css">
      <script>
      $(function() {
        $( "#datepicker" ).datepicker();
      });
      </script>
    </head>
    <body>

    <p>Date: <input type="text" id="datepicker"></p>

    </body>
</html>

但是，我将脚本和css的来源从jQuery更改为Google，它突然起作用。

<!doctype html>
<html lang="en">
    <head>
      <meta charset="utf-8">
      <title>jQuery UI Datepicker - Default functionality</title>
      <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
      <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
      <link rel="stylesheet" href="/resources/demos/style.css">
      <script>
      $(function() {
        $( "#datepicker" ).datepicker();
      });
      </script>
    </head>
    <body>

    <p>Date: <input type="text" id="datepicker"></p>

    </body>
</html>

我很高兴看到它有效，但我不明白为什么。这是特别令人困惑的，因为我想直接来自jQuery（这段代码的来源）的src应该比Google提供的更可靠，对吗？

Answer 1

添加http：在//

前面

//不会独自工作。

Answer 2

原因即阻止：

script src =“// code.jquery.com/jquery-1.10.2.js">

将在jQueryUI页面中工作，因为它们正在为它们引用本地文件（该文件存在于它们的服务器中）。

当您尝试在浏览器上使用日期选择器时，您必须从外部源（如googleapis或jquery.com）引用jQuery。正如CMadi所说，把http放在//前面会对你有用。

另一种解决方案是下载您引用的所有.js和.css，并将它们放在您拥有的.html文件旁边。

来自jQuery的Datepicker UI src不起作用，但来自Google的src确实如此。为什么？

2 个答案: