EasyUI - 如何在顶部添加新的手风琴项？答案

【问题标题】：EasyUI - How to add a new Item of Accordion on the top?EasyUI - 如何在顶部添加新的手风琴项？
【发布时间】：2015-06-16 09:50:35
【问题描述】：

我在网页上有一个使用手风琴的 jquery-easyui 应用程序。

Accordion 的 HTML 代码是：

<div id="taskAccordion" class="easyui-accordion" data-options="multiple:false" style="width:500px; height:300px;">
    <div title="Java" style="padding:10px;">
        <p>This is Java.</p>
    </div>
    <div title="PHP" style="padding:10px;">
        <p>This is PHP.</p>
    </div>
    <div title="JS" style="padding:10px;">
        <p>This is JS.</p>
    </div>
</div>

我想在运行时使用 JS 在 Accordion 中添加一个新项目。添加的JS函数是：

function addItem(){
    $('#taskAccordion').accordion('add',{
        title: 'Perl',
        selected: false,
        content:'This is Perl.'
    });
}

问题是：
新项目位于项目“JS”下。
如何将顶部的项目添加为第一个？在“Java”之前

谢谢！

【问题讨论】：

标签： jquery-easyui

【解决方案1】：

您可以在添加项目后立即更改项目的位置。以下函数将最后一个元素移动到手风琴的开头。如果您想将元素移动到不同的位置，您只需为现有元素指定 id，然后相应地修改选择器。

function addItem(){
    $('#taskAccordion').accordion('add',{
        title: 'Perl',
        selected: false,
        content:'This is Perl.'
    });
    $('#taskAccordion').prepend($("#taskAccordion").children().last());
}

【讨论】：

如果你能解释一下为什么 prepend 不复制最后一个元素而是移动它会很好？

【解决方案2】：

1.删除旧面板 2.添加新面板 3.添加旧面板

但是，解决方案是愚蠢的。呵呵

【讨论】：