1

我正在使用 jquery-select2 库来实现我的下拉菜单。

就我而言，我希望能够在用户单击下拉列表中的选项后触发操作。但是，单击或更改事件似乎不起作用

哈姆文件：

%select.medium.name_selector.pull_left
  %option.placeholder{value:"placeholder", disabled: "disabled", selected: "selected"} Start or find a conversation with a muser
  %option{value: "nick"} nick
  %option{value: "sam"} sam
  %option{value: "john} john

咖啡脚本文件：

events:
  "click option" : "displayChatScreen"

displayChatScreen: (e) ->
  e.preventDefault()
  nickname = @$("select.name_selector option:selected").val()
  if nickname != "placeholder"
    Backbone.history.navigate "messages/#{nickname}",
      trigger: true
  else
    alert "You need to select a friend to chat"

一旦我更改了我的 select2 下拉框的选项，是否会触发该操作？

注意：我已经尝试过单击和更改事件，但它们都不起作用

4

2 回答 2

4

使用 select2 您不能像使用change普通小部件那样使用普通事件<select>，但您实际上需要将您的displayChatScreen方法附加到changeselect2 提供的处理程序。

例如

$('select.medium.name_selector').on('change', this.displayChatScreen);

假设这是您的 select2 小部件的选择器，并且您在适当的上下文中运行它。

当您使用eventsBackbone 提供的默认哈希时，您实际上是在这样做：

$el.on('change', 'option', this.displayChatScreen);

由于 select2 实际上替换了<select>（因此<option>用一对标记<ul> <li>），您将永远不会真正收到浏览器事件。

此外，change事件在父元素<select>而不是<option>元素上触发。

于 2012-10-09T14:31:45.267 回答
0

您可以通过不呈现选项并在初始化时将其作为选项传递给 select2 来避免所有问题。

您可以像这样制作输入标签：

<input name="someName" value="selectedValues">

然后使用如下选项初始化 select2： $('input[name="SomeName"]').select2(options);

这样做可以让您安全地收听输入的更改，就像您经常使用事件哈希一样。

于 2015-01-30T16:40:39.373 回答