javascript - 使用 selectBoxIt JQuery 插件时如何检测选项更改？

Question

Live Demo On JSBin

  $(".abc123").selectBoxIt();

  $(document).on('mousedown', function(e) {
    if ($(e.target).parent().parent().parent().parent().children(":first").hasClass('abc123')) {
      var anchor = $(this).find('a');
      var test = $(anchor).text();
      alert($(this).parent().attr('class'));
    }
  })

上面是我的更大脚本的片段，我试图在其中应用附加功能 mousedown 部分。我正在使用selectBoxIt JQuery 插件，它将把任何基本的选择选项列表变成更漂亮的版本。

检测新选项更改的最佳解决方案是什么？

Answer 1

即使您使用插件来设置 select 的样式，您仍然可以 Hook 底层元素的 change 事件，如下所示:

$(".abc123").selectBoxIt().change(function() {
    console.log(this.value);
});

我不确定您当前的代码正在尝试执行什么操作，因为 this 是 document，因此尝试获取 parent() 没有实际意义，但是上面的代码至少可以让您在选择更改时获得当前值。