javascript - Ember - 仅针对视图父级触发“mouseEnter / mouseLeave”

Question

我正在尝试触发 mouseEnter 和 mouseLeave 以获得视图，特别是仅<li>包含子元素的元素。下面的代码似乎在<li>和它的孩子上添加了一个事件，它通常不返回<li>，通常是 a<p>或<img>。

如何仅针对<li>视图创建的对象？

我的观点：

App.MediaView.Gallery.Item = Ember.View.extend({
    tagName: 'li',

    mouseEnter: function(e) {
        var $this = $(e.target);

        if ($this.is('li')) {
            this.toggleDetails('show', $this);
        }
    },

    mouseLeave: function(e) {
        var $this = $(e.target);

        if ($this.is('li')) {
            this.toggleDetails('hide', $this);
        }
    },

    toggleDetails: function(which, $this) {
        console.log(which);
        console.log($this);
        console.log('------------------');
    }
});

我的模板：

<ul>

        {{#each content}}
            {{#view App.MediaView.Gallery.Item}}
                <div name="content" {{bindAttr class="size type"}}>

                    {{#if isImage}}
                        <img {{bindAttr src="content"}} alt="Title" />
                    {{else}}
                        <p>This is a video</p>
                    {{/if}}

                    <div class="vignette">
                        <div class="actions">
                            <a href="#" class="download">Download</a>
                            {{#if isImage}}<a href="#" class="enlarge">Enlarge</a>{{/if}}
                            <div class="clear"></div>
                        </div>
                    </div>

                </div>
            {{/view}}
        {{/each}}

    </ul>

Answer 1

基本上要获取视图创建的 DOM 元素，您可以使用this.$()此获取视图元素的 jQuery 对象。

希望能帮助到你。