<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(","))
};

*/

// 定義一個(gè)通用的拖動(dòng)排序函數(shù) AB模板網(wǎng) www.jncjggcm.com
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>"
    });
}

// 定義保存排序結(jié)果的函數(shù)
function saveOrder(boxId, inputName) {
    var data = $(`#${boxId} dl dt img`).map(function() {
        return $(this).data("url");
    }).get();
    $(`input[name=${inputName}]`).val(data.join(","));
}

// 初始化每個(gè)元素的拖動(dòng)排序功能
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>