可排序列表以更新隐藏的输入

Sortable list to update hidden input

本文关键字：隐藏 输入 更新 排序 列表      更新时间：2023-09-26

我有一个无序列表，可以使用jQuery进行排序。排序函数工作正常，如下所示。每个列表项都有一个这种格式的id-id="post_#"，其中#是一个唯一的数字。排序后，我需要用列表项的顺序更新隐藏的输入值，但只需要#。因此，如果项目的顺序是>post_3，post_2，post_4，post_1<则输入值为-value="3,2,4,1">

这是我迄今为止的jQuery-

<script type="text/javascript">
    jQuery(document).ready(function(){ 
        jQuery(function() {
            jQuery("#wpbody-content #post_sortable_list").sortable({ opacity: 0.6, cursor: ''move'', update: function() {
                var order = $(this).sortable;
            }
            });
        });
    });
    </script>

和HTML-

<div id="wpbody-content">
<ul id="post_sortable_list">
<li id="post_1">foo</li>
<li id="post_2">bar</li>
<li id="post_3">hello</li>
<li id="post_4">world</li>
</ul></div>
<input type="hidden" name="posts_order" value="" />

你能做一些类似的事情吗

var order = '';
 $('#post_sortable_list').find('li').each( function () {
  order = order + $(this).text().substring(5);
});
$('posts_order').val(order);

可能我偏离了的基础

<script type="text/javascript">
    jQuery(document).ready(function(){ 
        jQuery(function() {
            jQuery("#wpbody-content #post_sortable_list").sortable({ opacity: 0.6, cursor: ''move'', update: function() {
                var order = $(this).map(function(i, e){
                    return $(e).attr("id").substring(5);
                }.join(", ");
            }
            });
        });
    });
    </script>

尝试使用map获取所有Id，然后将它们连接到一个字符串中。

相关文章：