Question

我有一个骨干模板来代表一个足球运动员名单。渲染后，我通过插入其他模板来修改一些模板元素。视图的render（）函数是：

    render: function () {
        that = this;
        this.$el.html(template(this.model.attributes));

        var homeTeam = new player.PlayerCollection({team_id: this.model.get('home_id')});

        homeTeam.fetch({
        data: { forward_first:true, exlude_keepers:true},
        processData: true,
        success:function (collection) {

            var forwards = collection.where({'position':'Forward'});
            new PlayerListGoalView({players: forwards, 
                                    position:"Forward",
                                    el: $("#home-forwards", that.el), 
                                    player_id:that.player_id
                                });


            }
        });


        this.prepareList();
    },

生成的html有一系列嵌套列表，例如：

  <ul id="expList" class="topcoat-list list">
    <li id="home-forwards">
        <ul class="topcoat-list list">

            <li class="topcoat-list__item " id="player-713">
                <span>Fabio Borini</span>    
            </li>

            <li class="topcoat-list__item " id="player-696">        
                <span>Jozy Altidore</span>
            </li>

            <li class="topcoat-list__item " id="player-697">
                <span>Mikael Mandron</span>     
            </li>

        </ul>
    </li>
    <li id="away-forwards">

    </li>
    <li id="home-midfielders">

    </li>
    <li id="away-midfielders">

    </li>
    <li id="home-defenders">

    </li>
    <li id="away-defenders">

    </li>    
  </ul>

在prepareList（）中，我得到了主要的ul，然后是自己有ul的孩子：

    prepareList: function(){

        var ul = this.$('#expList');
        var el = ul.find('li:has(ul)');

        console.log('ul.length is:'); 
        console.log(ul.length);
        console.log('el.length is:'); 
        console.log(el.length);

    },

这导致“ul.length为：1”和“el.length为：0”。所以它是ul，但不是li。

当我在chrome检查器中展开ul标签时，我可以看到firstElementChild是li＃home-forwards，所有innerHTML都是如上所示。但它仍然不知何故得到了李。

现在，如果我将上面的html硬编码到模板中，则会找到ul和li！

有什么想法吗？

Answer 1

您应该在“成功”回调中调用this.prepareList()。现在你在尚未成功提取集合时调用它。

无法从Backbone模板中获取元素

1 个答案: