如何在插件配置期间访问 $(this) 元素以使用 jQuery 获取 data() 属性？

Question

我正在尝试配置 widgetpositioning for bootstrap-datetimepicker 以便它根据我在元素的 data-vertical-position 中设置的任何值打开。

例如，如果我有以下 html

<div class='input-group date' id='datetimepicker2' data-vertical-position="top">

我希望菜单在顶部打开而不是 "auto"

通常会像这样更改小部件的打开位置

$('.from').datetimepicker({
      widgetPositioning: {
          horizontal: 'auto',
          vertical: 'top'
      }
});

但是，我想在配置期间访问 $(this) 对象，因此可以检查该元素是否具有我应该设置的 data-vertical-position 值。所以我想这样做

$('.from').datetimepicker({
      widgetPositioning: {
          horizontal: $(this).data('horizontal-position') || 'auto',
          vertical: $(this).data('vertical-position') || 'auto'
      }
});

但是，这是行不通的。 $(this).data('horizontal-position') 似乎一直为空，将位置设置为默认值 auto。

Answer 1

如果插件不支持这种设置，您可以手动设置

$('.from').each(function() {
  var from = $(this);

  from.datetimepicker({
    widgetPositioning: {
      horizontal: from.data('horizontal-position') || 'auto',
      vertical: from.data('vertical-position') || 'auto'
    }
  })
});

如何在插件配置期间访问 $(this) 元素以使用 jQuery 获取 data() 属性？

How can I access $(this) element during a plugin configuration to get data() attributes with jQuery?

javascript

jquery

bootstrap-datetimepicker