如何使用 Bootstrap 3 DateTimePicker 获取事件的来源答案

【问题标题】：How do I get the source for my events, with Bootstrap 3 DateTimePicker如何使用 Bootstrap 3 DateTimePicker 获取事件的来源
【发布时间】：2015-09-04 12:53:17
【问题描述】：

我正在使用Bootstrap 3 DateTimePicker，但有一些小问题。

基本上，在 dp.show 事件中，我如何获得源代码控制？据我所知，事件没有发送参数，所以我很难弄清楚实际显示的是哪个控件。

（我的应用程序中有很多选择器）

标准 JQuery 会告诉我我可以使用 e.Target，但没有随事件发送 e :(

我该如何处理？

【问题讨论】：

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

【解决方案1】：

您可以将处理程序附加到您的日期选择器集合

$('.datepicker').on('dp.show', function() {
    // this here will refer to the currently showing widget
    console.log(this);
});

这是处理事件的标准引导方式。

编辑：如果您阅读源代码，该事件将绑定到初始化日期选择器的元素：https://github.com/Eonasdan/bootstrap-datetimepicker/blob/master/src/js/bootstrap-datetimepicker.js#L451

【讨论】：

【解决方案2】：

您可以使用如下事件

  <script src="//code.jquery.com/jquery-2.1.3.js" type="text/javascript"></script>
  <link href="/css/result-light.css" type="text/css" rel="stylesheet">
  <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js" type="text/javascript"></script>
  <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" type="text/css" rel="stylesheet">
  <link href="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/build/css/bootstrap-datetimepicker.css" type="text/css" rel="stylesheet">
  <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js" type="text/javascript"></script>
  <script src="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/src/js/bootstrap-datetimepicker.js" type="text/javascript"></script>

<script type="text/javascript">
    //&lt;![CDATA[
    $(function() {
      $('#datetimepicker6').datetimepicker();

      $("#datetimepicker6").on("dp.show", function(e) {
        console.log(e);// e is event and use console to explore other options
      });
    }); //]]&gt;
  </script>
</head>

<body>
  <div class="input-group ">
    <input type="text" class="form-control" id="datetimepicker6">
  </div>
</body>

</html>

【讨论】：