在网页设计中,经常会用到数字累加的效果,例如报名人数的累加。这时候,我们可以使用jQuery可以方便地实现这一效果
//html代码 <div>报名人数:<span id="num">0</span>人</div> //jquery代码 $(function(){ var num=$("#num").text(); //获取当前报名人数 $(document).on("click","#btn",function(){ //为按钮绑定click事件 num++; //点击一次累加一次 $("#num").text(num); //修改报名人数 }); });
首先,我们在html中设置了一个id为num的span标签,用于显示当前报名人数。然后,在jquery中,我们通过$(document).on("click","#btn",function(){})为按钮绑定click事件。在事件处理函数中,先获取当前报名人数,并将它存储在变量num中。然后,每点击一次按钮,就将num加1,最后通过$("#num").text(num)修改报名人数的显示。
这样,就实现了点击数字累加的效果。