引导程序组件（用于三个下拉列表中的日期、月份、年份）sompylasar/bootstrap-datepicker-select css 不工作

Question

这是组件https://github.com/sompylasar/bootstrap-datepicker-select

我需要三个日期、月份、年份的下拉菜单，就像这个组件所具有的那样（如果您查看 index.html），当您打开这个示例时，它可以正常工作，但是当我尝试实现它时，它可以正常工作（js 部分），除了 css 不起作用（它不像示例中那样），现在我知道我包含了所有 css 和 js 文件。我也尝试过他的 bootstrap css（他包括在内）然后它起作用了（下拉菜单看起来像他的），但它扰乱了我所有其他 pages.Now 我的问题，有没有解决这个问题的简单解决方案（我是 bootstrap 的新手），或者是否有另一个组件用于相同的事情，或者我应该只采用标准下拉菜单并用 foreach 填充日期、月份、年份。提前谢谢你

Answer 1

我使用 foreach 的经典方法

                    <div class="form-group">
                        <label for="selectDate">Date of Birth:</label>
                        <select id="selectDate" style="width:auto;" class="form-control selectWidth">
                            @for ($i = 1; $i <= 31; $i++)
                            <option class="">{{$i}}</option>
                            @endfor
                        </select>
                        <select id="selectMonth" style="width:auto;" class="form-control selectWidth">
                            @for ($i = 1; $i <= 12; $i++)
                            <option class="">{{$i}}</option>
                            @endfor
                        </select>
                        <select id="selectYear" style="width:auto;" class="form-control selectWidth">
                            @for ($i = 1900; $i <= 2015; $i++)
                            <option class="">{{$i}}</option>
                            @endfor
                        </select>
                    </div>

如果有人知道该插件，请在评论中写下或作为答案。

Answer 2

<!DOCTYPE html>
<html>
   <head>
      <title>Pick Year</title>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
      <link rel="stylesheet" href="//unpkg.com/bootstrap@3.3.7/dist/css/bootstrap.min.css" type="text/css" />
      <link rel="stylesheet" href="//unpkg.com/bootstrap-select@1.12.4/dist/css/bootstrap-select.min.css" type="text/css" />
      <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.2.0/css/datepicker.min.css" rel="stylesheet">
      <script src="//unpkg.com/jquery@3.4.1/dist/jquery.min.js"></script> 
      <script src="//unpkg.com/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script> 
      <script src="//unpkg.com/bootstrap-select@1.12.4/dist/js/bootstrap-select.min.js"></script> 
      <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.2.0/js/bootstrap-datepicker.min.js"></script>
   </head>
   <body>
      <input type="text" class="form-control" name="datepicker" id="datepicker" />
      <script>
         $("#datepicker").datepicker({
             format: "yyyy",
             viewMode: "years",
             minViewMode: "years",
             autoclose:true 
         });
      </script>
   </body>
</html>

引导程序组件（用于三个下拉列表中的日期、月份、年份）sompylasar/bootstrap-datepicker-select css 不工作

boostrap component (for date,month,year in three dropdowns) sompylasar/bootstrap-datepicker-select css not working

css

twitter-bootstrap