使用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的样式，你仍然可以挂钩底层元素的change事件，如下所示：

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

由于this document parent()是{{1}}，因此我不确定您当前的代码究竟在尝试做什么，因此尝试获取{{1}}是没有意义的，但上面的代码当它被改变时，它至少会得到选择的当前值。