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

Question

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

例如，如果我有以下 html

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

我希望菜单在顶部打开，而不是“自动”

通常人们会像这样改变小部件的打开位置

$('.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('horizo​​ntal-position') 似乎始终为 null，这将位置设置为默认 auto。

Answer 1

如果插件不支持这种类型的设置，您可以手动进行

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

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