Javascript 使用jquery将多个列表元素的名称聚合到单个数组中
我有一些列表允许使用sortable.js重新排列,我需要在拖动完成时创建一个排序顺序的数组。HTML格式如下:Javascript 使用jquery将多个列表元素的名称聚合到单个数组中,javascript,jquery,html,jquery-ui-sortable,Javascript,Jquery,Html,Jquery Ui Sortable,我有一些列表允许使用sortable.js重新排列,我需要在拖动完成时创建一个排序顺序的数组。HTML格式如下: <div id="catscontainer"> <div id="parentcat1" class="parentcatcontainer"> <h4 class="parentcathead">Parent Category One</h4> <ul class="subcatlist" id="ul
<div id="catscontainer">
<div id="parentcat1" class="parentcatcontainer">
<h4 class="parentcathead">Parent Category One</h4>
<ul class="subcatlist" id="ul-parentcat1">
<li id="parentcat1-subcat1">Sub Category One</li>
<li id="parentcat1-subcat2">Sub Category Two</li>
<li id="parentcat1-subcat3">Sub Category Three</li>
</ul>
</div>
<div id="parentcat2" class="parentcatcontainer">
<h4 class="parentcathead">Parent Category Two</h4>
<ul class="subcatlist" id="ul-parentcat2">
<li id="parentcat2-subcat1">Sub Category One</li>
<li id="parentcat2-subcat2">Sub Category Two</li>
<li id="parentcat2-subcat3">Sub Category Three</li>
</ul>
</div>
</div>
这导致了一个数组,orderListSub
,它只输出与之交互的父类别中的项目列表。这很好,但不符合我的目的。在mySQL中,我存储整个层次结构数组的序列化版本。对于这个问题,结构是多余的,但我确实需要在每次拖动完成后按顺序输出以下内容:
Parent Category ID
> Sub Category ID
> Sub Category ID
> Sub Category ID
Parent Category ID
> Sub Category ID
> Sub Category ID
> Sub Category ID
etc...
放入一个我可以序列化的数组中。目前,我正在研究迭代CATSCOContainer div中的每个UL以获得id名称,并在其中对LI id名称进行子迭代。这将使它们按顺序返回。有没有一种特别干净的方式通过jquery来实现这一点,或者sortable是否真的比我所经历的更好地实现了这一功能
更新:
我使用了下面的简单jquery,以在拖动后匹配其外观的顺序捕获列表的父元素和子元素的ID。这似乎是最简单的方法,我可以添加更多的代码将其转换为我需要的数组。如果没有更好的建议,我会加上这个作为答案
function catsToArrayJSON() { // called after drag complete
$("#catscontainer ul").each(function () {
console.log('Parent is: ' + this.id);
$(this).children("li").each(function () {
console.log('Child is: ' + this.id);
})
});
}
function catsToArrayJSON() { // called after drag complete
$("#catscontainer ul").each(function () {
console.log('Parent is: ' + this.id);
$(this).children("li").each(function () {
console.log('Child is: ' + this.id);
})
});
}
我使用了下面的简单jquery,以在拖动后匹配其外观的顺序捕获列表的父元素和子元素的ID。这似乎是最简单的方法,我可以添加更多的代码将其转换为我需要的数组
function catsToArrayJSON() { // called after drag complete
$("#catscontainer ul").each(function () {
console.log('Parent is: ' + this.id);
$(this).children("li").each(function () {
console.log('Child is: ' + this.id);
})
});
}