jq点击按钮移动图片顺序

        可以用于编辑图片列表顺序，或者自己上传图片列表时排好顺序发送给后端；

        数据动态绑定，至于样式什么的就自己随意发挥了，哈哈哈哈(附上丑陋的样式)

        .img-item .down_btn {
            position: absolute;
            padding: 5px 10px;
            right: 10px;
            bottom: 20px;
            height: 20px;
            line-height: 20px;
            background-color: #fff;
            border: 1px solid #333;
            border-radius: 5px;
            z-index: 999;
            cursor: pointer;
        }
        .img-item .up_btn {
            position: absolute;
            padding: 5px 10px;
            left: 10px;
            bottom: 20px;
            height: 20px;
            line-height: 20px;
            background-color: #fff;
            border: 1px solid #333;
            border-radius: 5px;
            z-index: 999;
            cursor: pointer;
        }

var imgHtml = ``;
imgList.map(t => {
    imgHtml += `<div class="img-item">
                    <img src="${t}" />
                    <span class="down_btn"></span>
                    <span class="up_btn"></span>
                </div>`
})

        function initMoveImg() {
            // 向下移动：
            $('.down_btn').on('click',function() {
                //img-item为图片外层的盒子，包含了down_btn和up_btn两个上下衣的按钮
                var partentsDiv = $(this).parents('.img-item');
                var next = partentsDiv.next();
                if(next.html() !== undefined) {
                    next.fadeOut('0',function(){
                        next.after(partentsDiv);
                    }).fadeIn();
                }
            })
            // 向上移动：
            $('.up_btn').on('click',function () {
                var parentDiv = $(this).parents('.img-item');
                var prev = parentDiv.prev();
                if(prev.html() !== undefined) {
                    prev.fadeOut('0',function () {
                        prev.before(parentDiv);
                    }).fadeIn();
                }
            })
        }

        initMoveImg();