【问题标题】:Can't init bootstrap-datepicker无法初始化 bootstrap-datepicker
【发布时间】:2017-11-08 16:38:20
【问题描述】:

我无法让 bootstrap-datepicker (https://github.com/uxsolutions/bootstrap-datepicker) 初始化正确的方式或调用任何方法或事件。

我正在使用 Laravel 5.4.7 / Vue 2.3.3 / jQuery 3.1.0

我的 html 看起来像这样:

<input type="text" data-provide="datepicker" />

但是当我尝试使用“官方”方式初始化日期选择器时,它没有设置任何属性(也没有错误):

    $('.datepicker').datepicker({
        todayHighlight: true
    });

无论我将代码放在哪里(开始、结束、vue created-method、vue mount-method、$nextTick)。

但是像这样设置值是可行的:

$.fn.datepicker.defaults.todayHighlight = true;

很遗憾,因为其他方法或事件似乎都不起作用,仅使用 $.fn.datepicker.defaults 是不够的。

有人知道可能出了什么问题吗?

【问题讨论】:

  • 您是否在 datepicker 库之前添加了 jQuery 库?
  • 在您的输入字段中添加class = "datepicker"

标签: jquery twitter-bootstrap datepicker vue.js bootstrap-datepicker


【解决方案1】:

将您的 input 字段代码更改为:

<input type="text" data-provider="datepicker" class="datepicker" />

问题在于 CSS 选择器,即您正在搜索具有 datepicker 类的元素,但它们不是这样的元素。

所以只需将类属性添加到它。

【讨论】:

  • 谢谢!我忽略了这一点。文档与它的示例有点不一致。我认为data-provider="datepicker" 标签就足够了。
  • @ArnovanOordt 如果您想使用 $('[data-provide="datepicker"]') 而不是类名,可以使用它。
  • @RoyJ 是的,但是 jQuery 代码使用了类选择器,所以在这种情况下添加类属性更容易
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-08-20
  • 1970-01-01
  • 1970-01-01
  • 2017-04-01
  • 2022-01-15
  • 2020-01-22
相关资源
最近更新 更多