html代码如下:
<div id="picK"> <ul> <li style="float:left;90px;"> <img src="/UpLoadFile/6ac74c39d3811db3ccff1324dd842a83.jpg"> <a href="javascript:void(0);">删除</a> </li> <li style="float:left;90px;"> <img src="/UpLoadFile/52c7b053aa14582adcf5862f1c54a317.jpg"> <a href="javascript:void(0);">删除</a> </li> </ul> </div>
效果图为:
如果实现点击删除后,可以把图片元素移除javascript代码如下:
<script> $("#picK li a").click(function(){ //当点击“删除”后,li元素消失 $(this).parent().remove(); //获取删除的图片链接 var img=$(this).prev().attr("src"); //截取图片名称 var img=img.substr(-47); //获取隐藏域的图片集字符串 var allimg=$("#pics").val(); //把图片集字符串拆分成数组 var arrimg=allimg.split(";"); //从数组中根据图片名称删除数组元素 arrimg.splice($.inArray(img,arrimg),1); //合并数组元素为字符串 arrimg=arrimg.join(";"); //把新的图片集字符串保存到隐藏域 $("#pics").val(arrimg); }); </script>