如何没有设置EL或标记名与jQuery UI的手风琴工作jQueryUI的手风琴的

Question

结构是这样的，

<h2>title</h2><div>content</div> 

每个项目。我所要做的是创建手风琴通过循环我的骨干视图的内部，但是骨干网为每个项目div标签，所以我有这样的

<div><h2>title</h2><div>content</div></div> 

这使得jQuery的手风琴控制工作不正常的html代码，崩溃并展开不起作用。 我认为这可以解决，如果我可以不设置任何关于el或标记名，但我找不到。 有什么办法可以解决这个问题吗？

Answer 1

我觉得你最好把手风琴留在一个视图上，然后在每个面板里面都有独立的视图。毕竟，<h2>是整个手风琴的控制器，而不是特定的面板。

你最好有一些每个小组的观点是这样的：

var P = Backbone.View.extend({ 
    render: function() { 
     // Add the panel's content to this.$el (which is a <div> by default). 
     return this; 
    } 
}); 

然后手风琴看法是这样的：

var A = Backbone.View.extend({ 
    render: function() { 
     var panels = [ ... ]; 
     for(var p, i = 0; i < panels.length; ++i) { 
      p = new P({ ... }); 
      this.$el.append('<h3><a>' + panels[i] + '</a></h3>'); 
      this.$el.append(p.render().el); 
     } 

     // The accordion wants to know the sizes of things so 
     // we let the DOM sort itself out before binding the 
     // accordion. 
     var _this = this; 
     setTimeout(function() { _this.$el.accordion() }, 0); 

     return this; 
    } 
}); 

那么你可以简单$('#something').append((new A).render().el)，它均能同时进行工作留下应有的一切。

你也可以添加一个title方法将P意见，然后A可以要求面板就是它的名字/标题/头应该是让所有的每个面板的信息很好地包含在每个面板视图。

演示：http://jsfiddle.net/ambiguous/Y49W8/