HTML
首先我们在示例中放三件商品,并且在商品的左上角放上一颗红心,用于点击我喜欢功能。
<ul class="list clearfix"> <li> <img alt="纯棉嘴唇珠片T恤短裙套装" src="1.jpg" /> <p> <a class="likes" title="我喜欢" href="#">2100</a> </p> </li> <li> <img alt="【成名夜】九分休闲裤" src="2.jpg" /> <p> <a class="likes" title="我喜欢" href="#">716</a> </p> </li> ... </ul>
jQuery
当用户点击自己喜欢的图片上的红心按钮时,更新原有的数值。
$(function() { $(".likes").click(function() { var obj = $(this); obj.fadeOut(300); //以下通过ajax成功返回,这里ajax不作代码演示 var num = parseInt(obj.text()); obj.text(num + 1).fadeIn(300); }); });