您的位置: 首页>模板常用

pbootcms后台自定义字段多图上传 不能多图拖动解决办法

时间:2025-10-23

<script type="text/javascript">


/*

$("#pics_box").dragsort({

    dragSelector: "dl",

    dragSelectorExclude: "input,textarea,dd",

    dragBetween: false,

    dragEnd: saveOrder,

    placeHolderTemplate: "<dl class='placeHolder'><dt></dt></dl>"

});




function saveOrder() {

    var data = $("#pics_box dl dt img").map(function() {

        return $(this).data("url");

    }).get();

    $("input[name=pics]").val(data.join(","))

};


*/


// 定义一个通用的拖动排序函数 

function setupDragSort(boxId, inputName) {

    $(`#${boxId}`).dragsort({

        dragSelector: "dl",

        dragSelectorExclude: "input,textarea,dd",

        dragBetween: false,

        dragEnd: function() {

            saveOrder(boxId, inputName);

        },

        placeHolderTemplate: "<dl class='placeHolder'><dt></dt></dl>"

    });

}


// 定义保存排序结果的函数

function saveOrder(boxId, inputName) {

    var data = $(`#${boxId} dl dt img`).map(function() {

        return $(this).data("url");

    }).get();

    $(`input[name=${inputName}]`).val(data.join(","));

}


// 初始化每个元素的拖动排序功能

setupDragSort("pics_box", "pics");

setupDragSort("ext_yszp_box", "ext_yszp");

setupDragSort("ext_xiaogutu_box", "ext_xiaogutu");

setupDragSort("ext_caipingtu_box", "ext_caipingtu");

setupDragSort("ext_wangongtu_box", "ext_wangongtu");

</script>


声明:

本站部分文章为转载,是出于传递更多信息之目的。若有文章侵犯了您的合法权益,请作者持权属证明与本站联系,我们将及时更正、删除,谢谢!