Question

我目前正试图仅在悬停元素上触发Bootstrap弹出窗口。不幸的是，它触发了页面上的所有内容。下面是Backbone脚本（在CoffeeScript中）：

Site.Views.Stories ||= {}

class Site.Views.Stories.IndexView extends Backbone.View
  template: JST["backbone/templates/stories/index"]

  initialize: () ->
    @options.stories.bind('reset', @addAll)

  addAll: () =>
    @options.stories.each(@addOne)

  addOne: (story) =>
    view = new Site.Views.Stories.StoryView({model : story})
    @$("#columns").append(view.render().el)

  render: =>
    $(@el).html(@template(stories: @options.stories.toJSON() ));
    @addAll()
    return this

  events: =>
    "mouseover .rating" : this.showhover

  showhover: => 
    this.$('.rating').popover('show');

Answer 1

我猜你的视图.rating中有多个el个元素，所以这个：

this.$('.rating').popover('show');

击中他们所有人。如果您只想要接收事件的.rating，请通过从事件处理程序的事件参数中获取特定的.rating来说明：

showhover: (ev) =>
  $(ev.currentTarget).popover('show')

我在这里的其他一些事情：

Backbone不再自动设置@options，如果您需要@options，则必须在initialize手动执行此操作：
```
initialize: (@options) -> ...
```
您不需要为events使用某个功能，这没关系：
```
events:
  "mouseover .rating" : 'showhover'
```
您无需=>所有方法。我不认为你需要为它们中的任何一个做这些（假设你使用events对象而不是函数），除了@addAll，但是你可以使用@listenTo来解决这个问题。或者将第三个参数提供给bind。

Backbone事件监听器触发所有元素

1 个答案: