2

ビューの mouseEnter と mouseLeave 、具体的<li>には子を含む要素のみをトリガーしようとしています。以下のコードは と その子にイベントを追加しているように見えますが<li>、これは通常 を返さず<li>、通常は<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>
4

1 に答える 1

2

基本的に、ビューによって作成された DOM 要素を取得するには、this.$()これを使用して、ビューの要素の jQuery オブジェクトを取得します。

それが役に立てば幸い。

于 2013-07-02T22:28:23.913 に答える