ember.js ReferenceError：firefox中未定义事件

debugcn 发表于 Dev

麦克风

我想在ember动作中访问事件对象以检查目标元素。这在Chrome和Safari中有效，但在Firefox 25.0中则无效。

我什至没有收到错误消息。我如何在ember动作中访问事件对象，或者有没有余烬方法？

繁殖方法：

打开我的小提琴
单击div或“单击我”链接，应打开一个警报框
在chrome和firefox中测试这些

的HTML

  <script type="text/x-handlebars" data-template-name="application">
      <h1>Click the link in the following div</h1>
      {{outlet}}
  </script>
  <script type="text/x-handlebars" data-template-name="index">
      {{test-a}}
  </script>
  <script type="text/x-handlebars" data-template-name="components/test-a">
    <div class="index" {{action 'edit' on="click"}}>
        <a href="http://www.example.com" target="_blank">Click me</a>
    </div>
  </script>

咖啡

App = Ember.Application.create({});

App.TestAComponent = Ember.Component.extend
    actions:
        edit: ->
            if event.toElement.nodeName.toUpperCase() == 'A'
                return true # should bubble to the window but is a component
            # do something for editing here
            alert('div clicked')
            false

的CSS

h1 { font-size: 1.6em; padding-bottom: 10px; }
h2 { font-size: 1.4em; }
ul { padding: 15px; font-size: 1.4em; color: green; }
.index { background-color: #666; padding: 20px; }

http://jsfiddle.net/mszrnyi/3REEj/2/

Marcio Junior

有些浏览器会在中创建一个全局事件对象window.event，但这并不是跨浏览器。

使用动作处理程序，您将无法正常工作。因为操作是处理浏览器事件的顶级方法。因此，不会传递任何事件对象，并且在{{action}}触发aevent.preventDefault()时会执行，因此您的链接不会打开新窗口。

您将只需要使用click。这是处理浏览器事件的底层方法，因此您将在第一个参数中获得事件对象。气泡基于布尔返回的预期行为：

 App.TestAComponent = Ember.Component.extend    
    click: (event) ->                
        if event.toElement.nodeName.toUpperCase() == 'A'
            alert('link clicked')
            return true # should bubble to the window but is a component
        # do something for editing here
        alert('div clicked')       
        false

另外，{{action 'edit' on="click"}}需要从components/test-a模板中删除。否则event.preventDefault()将执行。

  <script type="text/x-handlebars" data-template-name="components/test-a">
    <div class="index">
        <a href="http://www.example.com" target="_blank">Click me</a>
    </div>
  </script>

这是更新的小提琴http://jsfiddle.net/8Ephq/

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。