如何在 jQueryui-sortable 上获取带有 'li' 文本的索引？

Question

我正在使用 jqueryui-sortable。我想以数组的形式获得最终结果。

HTML:

<ul class="bizline-sortable-section ui-sortable">                   
    <li class="ui-state-default ui-sortable-handle">home-slider</li>                    
    <li class="ui-state-default ui-sortable-handle">home-quote</li>                 
    <li class="ui-state-default ui-sortable-handle">home-service</li>                   
    <li class="ui-state-default ui-sortable-handle">home-features</li>                  
    <li class="ui-state-default ui-sortable-handle">home-testimonial</li>                   
    <li class="ui-state-default ui-sortable-handle">home-team</li>                  
    <li class="ui-state-default ui-sortable-handle">home-cta</li>                   
    <li class="ui-state-default ui-sortable-handle">home-news</li>                  
</ul>

我希望拍摄后的输出为：

[
  home-slider : final index,
  home-quote : final index,
  home-service : final index
]

Answer 1

使用document.querySelectorAll(".bizline-sortable-section li")获取所有li元素，并进行一些修改：

var elements = document.querySelectorAll(".bizline-sortable-section li");
var texts = Array.from(elements).map(el => el.innerText);
var indexes = Object.fromEntries(texts.map(el => [el, texts.indexOf(el)]));
console.log(indexes);

<ul class="bizline-sortable-section ui-sortable">
  <li class="ui-state-default ui-sortable-handle">home-slider</li>
  <li class="ui-state-default ui-sortable-handle">home-quote</li>
  <li class="ui-state-default ui-sortable-handle">home-service</li>
  <li class="ui-state-default ui-sortable-handle">home-features</li>
  <li class="ui-state-default ui-sortable-handle">home-testimonial</li>
  <li class="ui-state-default ui-sortable-handle">home-team</li>
  <li class="ui-state-default ui-sortable-handle">home-cta</li>
  <li class="ui-state-default ui-sortable-handle">home-news</li>
</ul>

如何在 jQueryui-sortable 上获取带有 'li' 文本的索引？

How can I get index with 'li' text on jQueryui-sortable?

javascript

jquery

jquery-ui-sortable