A-A+

jquery点赞功能

2015年03月08日 jquery 暂无评论 阅读 543 次

jquery计数功能: 对 click 这个操作计数,比如设计一个变量 每点击一次某个button 那个变量就+1.
如果你想让我这计数的值在别的js里也可用的话,直接把这个值放到表单的属性里去,比如:

<input type="button" name="btn" id="btn" value="计数按钮" addval="" />

var i=0;//设置一个全局的变量

$("#btn").click(function(){

i+=1;//第单击一次i的值加1

$(this).attr("addval",i);

});

这样的话就把这个值保存到表单的属性里了,你想怎么用都行了


【jquery】实现‘点赞’效果(无保存数据,无身份认证,无次数限制)

描述:纯js效果练习。

实现思路:

点击时-》获取点击标签的坐标(top,left)-》加入一个新的div,设置其初始位置(图中的+1)-》设置其动画效果-》设置结束后隐藏-》获取原标签内部数字并+1

js实现代码

$(document).ready(function(){

$('a.zan').click(function(){

var left = $(this).offset().left+10;
var top = $(this).offset().top+10;

var obj = $(this);

$(this).append('<div id="zan">+1</div>');

$('#zan').css({
'position':'absolute',
'top':top,
'left':left,
'color':'red'
}).animate({
'left':top+20,
'top':top+20,
},'slow',function(){
$(this).remove();

var sum =obj.find('span').text();
sum++;

obj.find('span').text(sum);})})

})

html代码:

<a href='#' class="zan">赞(<span>0</span>)</a>


3.http://pan.baidu.com/s/1kTzLgf9111

 

标签:

给我留言

Copyright © web前端技术开发个人博客 保留所有权利  京ICP备14060653号 Theme  Ality

用户登录