像淘宝上面那样，鼠标悬停时单击左右按钮 和删除按钮。 单击左边时，原来图片会向向移动，向左的图片会引用到原来的位置。
传送门
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title><link rel="stylesheet" href="bootstrap.min.css">
<link rel="stylesheet" href="upload.css">
</head>
<body>
<ul class="upload inline-control">
<li class="pic0">
<img src="//192.168.0.3:8888/resource/image/1.jpg" id="cart-1">
<p class="operate">
<i class="toleft">左移</i>
<i class="toright">右移</i>
<i class="del" data-id="1">删除</i>
</p>
</li>
<li class="pic1">
<img src="//192.168.0.3:8888/resource/image/2.jpg" id="cart-2">
<p class="operate">
<i class="toleft">左移</i>
<i class="toright">右移</i>
<i class="del" data-id="2">删除</i>
</p>
</li>
<li class="pic2">
<img src="//192.168.0.3:8888/resource/image/3.jpg" id="cart-3">
<p class="operate">
<i class="toleft">左移</i>
<i class="toright">右移</i>
<i class="del" data-id="3">删除</i>
</p>
</li>
<li class="pic3">
<img src="//192.168.0.3:8888/resource/image/4.jpg" id="cart-4">
<p class="operate">
<i class="toleft">左移</i>
<i class="toright">右移</i>
<i class="del" data-id="4">删除</i>
</p>
</li>
<li class="pic4">
<img src="//192.168.0.3:8888/resource/image/5.jpg" id="cart-5">
<p class="operate">
<i class="toleft">左移</i>
<i class="toright">右移</i>
<i class="del" data-id="5">删除</i>
</p>
</li></ul>
<script src="js/jquery.min.js"></script>
<script>
$(".toright").click(function(){
});
$(".toleft").click(function(){
});
$(".del").click(function(){
// var $this=$(this),
// id=$this.data('id'),
// $parent=$("#cart-"+id);
// $parent.fadeOut();
$("#cart-"+$(this).data('id')).remove()
});</script>
</body>
</html>
index()可以获取到某个元素在兄弟节点中的位置，先获取到你点击的那个图片在同级节点中的位置，让位置减一，获取到减一后位置的元素的ID，再把这个元素插入到那个元素前面去，就左移了
这个写法是怎么写啊？
黄舟2017-04-10 15:54:53
建议用Model > View的方法，把LI对象先保存到不可见的数据层中，要移位时先在数据层的数组的排序好，然后把UL清空，把新顺序的LI写进UL上。
先保存当前位置：
window.arr = [];
$('ul > li.pic').each(function(i){
$('.left', this).on('click', function(){
liOnClick('left', i);
});
$('.right', this).on('click', function(){
liOnClick('right', i);
});
window.arr.push(this);
});处理向左向右事件：
function liOnClick(direction, i){
var temp;
if(direction == 'left') {
temp = window.arr[i];
window.arr[i] = window.arr[i-1];
window.arr[i-1] = temp;
}
if(direction == 'right') {...}
liRender();
}重绘LI
function liRender() {
$('ul').empty();
$.each(window.arr, function(){
$('ul').append(this);
});
}以上为大概的代码，仅供参考，不保证运行正常。
