Bootstrap 3 DatePicker 不工作答案

【问题标题】：Bootstrap 3 DatePicker not workingBootstrap 3 DatePicker 不工作
【发布时间】：2014-01-07 22:56:52
【问题描述】：

在这里尝试使用日期选择器：http://bootstrap-datepicker.readthedocs.org/en/latest/

我对 jquery 还没有那么丰富的经验，但我一定错过了一些东西，因为它永远不会起作用。这是我的 HTML，所有的 CSS 和 JS 文件都在各自的位置，没有找不到文件的问题。我确定我遗漏了一些简单的东西，但我没有看到它，直接从提供的示例中复制和粘贴。让我知道你的想法。

<!DOCTYPE html>
<html>
  <head>
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/datepicker.css" rel="stylesheet">
  </head>
  <body>
    <div class="container">
        <div class="row">
            <div class="col-lg-8">
          <form id="main">
            <input type="text">
          </form>
          <script>
           $('#main input').datepicker({
             });
          </script>
        </div>
      </div>
    </div>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://code.jquery.com/jquery.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.js"></script>
    <script src="js/bootstrap-datepicker.js"></script>    
  </body>
</html>

【问题讨论】：

您的错误控制台中有任何消息吗？
删除第一个

标签： jquery twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

您的代码存在一些问题

You need a document ready handler
您需要在包含库后将脚本放在最后
您有重复的脚本标签

这是你需要做的事情

<!DOCTYPE html>
<html>
<head>
    <link href="css/bootstrap.css" rel="stylesheet" />
    <link href="css/datepicker.css" rel="stylesheet" />
</head>
<body>

<form id="main">
    <input type="text" />
</form>

<script src="https://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
<script>
    $(document).ready(function() {
        $("#main input").datepicker();
    });
</script>
</body>
</html>

【讨论】：

仅供参考 - 你的代码确实不需要一个document ready处理程序。脚本中引用的所有 DOM 元素在执行时都可用
@Phil 因为#main 是上面定义的？如果你知道我可以在哪里搜索，我对处理这方面的资源很感兴趣。
是的。您在答案中链接到的 SO 帖子解释得很清楚
完美，谢谢。唯一的问题是这一行：'
谢谢！我花了很长时间阅读了很多帖子才弄清楚这一点。第 2 点对我有用，我必须将我的脚本放在我的剃须刀代码中的 @section scripts {