2011-10-19 37 views
0

我有一个jquery-ui手风琴部件列表项目部分工作正常(他们也可排序)。但是用户可能会使用html input元素来添加项目部分。添加元素到jquery的手风琴部件

我想在手风琴小部件上添加新元素。

我的方法如下:销毁手风琴和可排序的小部件,然后克隆小部件的第一个元素,并将其前置到被克隆的元素,以便新元素成为第一个元素。之后,再让小部件再次手风琴和排序。

它确实重新创建了小部件,但它不包含添加的元素!我不明白为什么不能...

的HTML转换为一个widget:

<div id="accordion"> 
     <div> 
      <h3><a href="#">Part</a></h3> 
      <div> 
       Some explaining text 
      </div> 
     </div> 
    </div> 

的JavaScript/jQuery的,这使得第一次加载手风琴也使得排序和手风琴的工作好一起(停止功能):

var stop = false; 
$('#accordion h3').click(function(e) { 
    if (stop) { 
     e.stopImmediatePropagation(); 
     e.preventDefault(); 
     stop = false; 
    } 
}); 
$('#accordion') 
    .accordion({ 
     header: '> div > h3', 
     fillSpace: true 
    }) 
    .sortable({ 
     axis: 'y', 
     handle: 'h3', 
     stop: function() { 
      stop = true; 
    } 
}); 

JavaScript时克隆,并预置元件到窗口小部件,并重新创建插件:

$('#accordion').accordion("destroy").sortable("destroy"); 
$("#accordion > div:first").clone().prependTo("#accordion > div:first"); 
$('#accordion') 
    .accordion({ 
     header: '> div > h3', 
     fillSpace: true 
    }) 
    .sortable({ 
     axis: 'y', 
     handle: 'h3', 
     stop: function() { 
      stop = true; 
     } 
    }); 

回答

0

好的,有时解决方案可能非常明显。问题在于使用prependTo()函数。它应该是:insertBefore()/已解决