javascript - 将多个 Backbone View $el 合并到一个 jQuery 对象中

我希望它出现在 DOM 中:

<body>
  <ul>
    <li>This is 1</li>
    <li>This is 2</li>
    <li>This is 3</li>
    <li>This is 4</li>
  </ul>
</body>

ul 是parentView，li 是subView。这就是我希望它的工作方式:

parentView 将在简单的 for() 循环中初始化和创建 subView 作为示例。
我不想在 addSub 中呈现每个 subView 创建，所以我只返回 jQuery 对象 $el subview 。
parentView 将保存这些 $el 并将它们合并到单个 jQuery 对象中，例如 $new。为此，我使用 jQuery 函数 .add()。
然后在循环完成后，将 $new 渲染到 DOM。所以一切都必须发生在 DOM 之外。

现在我的代码不起作用。它没有显示任何内容。我做错了什么？

最佳答案

这里有几处不正确。在您的 ParentView 中，您的代码:

    for (i=1;i<=4;i++) {
        $new.add(this.addSub(i));
    }

    this.$el.html($new.html());

$new.add(this.addSub(i)) 由于 .add() 工作方式的性质，未被保存。您需要将此行更改为 $new = $new.add(this.addSub(i));使其发挥作用。

我建议完全避免使用这种方法，并考虑使用 .append 在每次迭代中将 li 添加到 ul。

例如this.$el.append(this.addSub(i)) 或 this.$el.append(this.addSub(i).render().el)

同样，您对 .add() 的使用会导致您的 $el.html($new.html())，但这是不必要的，因为 $new 本身就是您的 4 li 元素所以你可以用 this.$el.html($new);

调用 $new 本身

最后，您需要在您的 parentView 中设置您的“根”元素，删除 tagName: ul 它应该是 el: ul 因为它需要一些东西来设置您的 subview 到

这是您在这里工作的代码的更新 jsfiddle:http://jsfiddle.net/SQFwg/

如果您要从这里拿走任何东西，那就是不要使用 .add() 而是使用 .append()!

关于javascript - 将多个 Backbone View $el 合并到一个 jQuery 对象中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12985677/