1

我花了很多时间寻找一个好的 datetimepicker（不幸的是 jquery 只提供了一个 datepicker）。我试图在我的网页中使用http://tarruda.github.io/bootstrap-datetimepicker/，但它覆盖了我的 css，我在尝试“范围”它时失败了。你能帮帮我吗？

编辑：这是覆盖我的css的代码：

    <!DOCTYPE HTML>
<html>
  <head>
    <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" media="screen"
     href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">
  </head>
  <body>

    <div id="datetimepicker" class="input-append date">
      <input type="text"></input>
      <span class="add-on">
        <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
      </span>
    </div>

    <script type="text/javascript"
     src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js">
    </script> 
    <script type="text/javascript"
     src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js">
    </script>
    <script type="text/javascript"
     src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js">
    </script>
    <script type="text/javascript"
     src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.pt-BR.js">
    </script>
    <script type="text/javascript">
      $('#datetimepicker').datetimepicker({
        format: 'dd/MM/yyyy hh:mm:ss',
        language: 'pt-BR'
      });
    </script>
  </body>
<html>

在这里 https://github.com/tarruda/bootstrap-datetimepicker有一些较少的文件，但不幸的是我从未使用过 LESS（而且我不是 css 专家）而且我真的不知道如何限制 twitter-bootstrap和 bootstrap-datetimepicker 到 div “datetimepicker”。

我必须做什么？

4

2 回答 2

1

您可能已经找到了另一种解决此问题的方法，但是对于那些仍在尝试使用此插件的人...

首先，如上所述，booltrap 是必要的！

boolstrap 已经有一个日期选择器样式，我可以使用它。

为此，我下载了http://tarruda.github.io/bootstrap-datetimepicker/中提供的 zip

其中有一个 bootstrap-datetimepicker.min.css。

我所做的是，而不是调用这个 css，而是创建一个新的（datetimepicker.css），在这个新文件中，我复制了 tarruda 的 .min.css 中包含的 css

在代码的最后，我复制了 boolstrap 的 datepicker css (datepicker.css)

我知道这不是世界上最好的做法，但它奏效了，而且在紧迫的期限内，这可能会有所帮助..

于 2013-10-04T04:37:01.823 回答
0

您使用的插件是引导插件。它要求您使用引导程序，它是一个 CSS 框架。Bootstrap 对某些元素进行风格化，并带有自己的一组样式。如果没有 twitter bootstrap，您将无法使用此插件（Twitter bootstrap 会覆盖您的 css）

如果没有引导程序，这个插件将无法工作，所以恐怕你必须找到另一个。尝试使用 jquery UI 插件。这些东西通常不会添加脚手架代码。搜索 jquery UI 时间选择器。

你能确定 Bootstrap 的范围吗？是的。你需要学习一点LESS。 查看此答案

更容易获得另一个插件。您还可以使用您需要的引导程序的那些部分。

于 2013-08-07T11:00:24.380 回答