视图中的ui定义范围

Question

哪个是正确的？
单击中的clickedButton时，以下代码运行.my-button a）整个文件
b）仅#my-element

如果答案是a）。怎么做b）？

var MyView = Marionette.ItemView.extend({
  el: '#my-element',

  ui: {
    button: '.my-button'
  },

  events: {
    'click @ui.button': 'clickedButton'
  },

Answer 1

答案恰好是B. 在BackboneJS的delegateEvents中，将事件绑定到元素时有DOM的范围，代码如下：

this.$el.on(eventName, selector, method);

你可以运行这个： HTML是

<button class="my-button">Click Me - 1</button>
<div id="my-element">
  <p>Hello World</p>
  <button class="my-button">Click Me - 2</button>
</div>

脚本是

var MyView = Marionette.ItemView.extend({
  el: '#my-element',

  template: false,

  ui: {
    paragraph: 'p',
    button: '.my-button'
  },

  events: {
    'click @ui.button': 'clickedButton'
  },

  clickedButton: function(evt) {
    console.log('I clicked the button ['+$(evt.target).html()+']!');
  }
});