关于关注和取消关注的nodejs写法
本例子的关注和取消关注,是通过ajax的方法实现的;nodejs后台写好api接口;响应前台的ajax
先看ajax的代码实现:
// 用户关注标签
function subscribe(uid, tid) {
if(!uid || uid.length === 0) window.location.href = '/signin'; var api = "/users/" + uid + "/tags/" + tid; $.post(api, function(data) {
var effect = 'animated bounceIn';
var btn = $("#subscribe-btn");
btn.addClass('active').html('已关注');
btn.addClass(effect);
btn.one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {
btn.removeClass(effect);
btn.attr('onclick', "unsubscribe('" + uid + "', '" + tid + "');");
});
});
} // 用户取消关注标签
function unsubscribe(uid, tid) {
var api = "/users/" + uid + "/tags/" + tid;
$.delete(api, function(data) {
var effect = 'animated bounceIn';
var btn = $("#subscribe-btn");
btn.removeClass('active').html("<span class='fa fa-plus'></span> 订阅");
btn.addClass(effect);
btn.one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {
btn.removeClass(effect);
btn.attr('onclick', "subscribe('" + uid + "', '" + tid + "');");
});
});
}
比较有技巧的地方是,在关注的时候发生了两件事:
1、向后台发送数据;
2、添加动画特效,
3、动画特效完成后回调,修改a标签的onclick属性,使其再次被点击时触发 取消关注 事件;
需要注意的是,关注和取消关注是通过a标签的onclick属性触发javascript函数的,行间事件;
还有一种是在href中触发;
后台api代码如下:
/* 用户添加关注标签 */
router.post('/users/:id/tags/:tid', function(req, res) {
thenjs.parallel([
function(cb) {
User.findById(req.params.id).exec(function(err, me) { cb(err, me); });
},
function(cb) {
Tag.findById(req.params.tid).select('id').exec(function(err, tag) { cb(err, tag); });
}
]).then(function(error, results) {
var me = results[0];
var tag = results[1]; if(me && tag) {
if(!me.tags) me.tags = [];
me.tags.push(tag.id);
me.tags = _.unique(me.tags, function(t) { return t.id; });
me.save(function(err) {
res.json({error:err, tag: tag});
});
} else {
res.json({error:"not found user or tag"});
}
});
}); /* 用户取消关注标签 */
router.delete('/users/:id/tags/:tid', function(req, res) {
User.findById(req.params.id).exec(function(err, me) {
if(me) {
me.tags = _.remove(me.tags, function(t) { return t.id == req.params.tid});
me.save(function(err) {
res.json({error:err});
})
} else {
res.json({error:"not found user or tag"});
}
});
});
此段代码中用到了then.js;
并且好像有delete方法,$.delete是jquery ajax方法吗;
暂时搁置;去谷歌
找到了一篇文章:这篇文章提到了一句
http://www.cnblogs.com/tylerdonet/p/3520862.html
关于关注和取消关注的nodejs写法的更多相关文章
- python Sina微博自动转发带抽奖字样的微博,添加关注,取消关注
项目地址:https://github.com/chengshuyi/SinaWeibo 具有的功能 转发带抽奖字样的微博并可以@相应数量的好友 提取关注并添加关注 取消关注 获取粉丝列表
- jQuery-ajax: 取消关注|关注
ylbtech-jQuery-ajax: 取消关注|关注 1.A,jQuery-效果图返回顶部 1.B,jQuery-Source Code(源代码)返回顶部 <script src=&qu ...
- js-点击+加关注变成已关注,已关注状态时,鼠标滑动上的状态时取消关注
效果: HTML: <div class="rightBtn cur">+关注</div> CSS: .rightBtn{ width: 80px; hei ...
- h5开发微信公众号重定向到关注页面没有关注按钮 (微信你个坑)
搜索微信公众号是这样的 微信公众号重定向到关注页面没有关注按钮 如何微信公众号重定向到关注页面没有关注按钮,请看上篇笔记 无解,微信一直在封这种通过链接跳转到公众号关注页面的方法.只有放个二维码提示长 ...
- JQuery实现点击关注和取消功能
点赞,网络用语,表示“赞同”.“喜爱”. 该网络语来源于网络社区的“赞”功能.送出和收获的赞的多少.赞的给予偏好等,在某种程度能反映出你是怎样的人以及处于何种状态.点赞的背后,反映出你自己.与之对应的 ...
- juqery 给本身的class加上一个class 或也可以实现关注商品,取消关注商品
$("#goods1").on("click",".ICON-fen-LOVE",function(){ var $this = $(thi ...
- 微信公众平台开发教程Java版(六) 事件处理(菜单点击/关注/取消关注)
https://blog.csdn.net/tuposky/article/details/40589325
- 判断是否关注了微信公众号 subscribe 0=未关注 1=已关注
$appid=''; $secret=''; //微信网页授权获取openid $web_url='http://www.xxxx.com/shouquan.php'; if (!isset($_GE ...
- flask_关注者,联系人和好友
在这节我们实现的功能比较复杂,就是实现用户"关注"和"取消关注"的功能. 一个用户可以关注多个其他的用户,一个用户也可以被其他多个用户所关注,这样看的话,在数据 ...
随机推荐
- 使用AES加密的帮助类
在开发中经常使用加密/解密对一些内容进行处理,比如密码在存入数据库之前先经过加密处理等等,这里就把一个加密帮助类代码贴出来,供以后查找使用. 这个帮助类主要功能是对字符串和字节数组进行加密解密处理. ...
- 检测android的版本的办法
http://www.cnblogs.com/wzh206/archive/2010/05/02/1726076.html 如何判断Android系统的版本 随着Android版本的增多,在不同的版本 ...
- Cacti 是一套基于PHP,MySQL,SNMP及RRDTool开发的网络流量监测图形分析工具
Cacti 是一套基于PHP,MySQL,SNMP及RRDTool开发的网络流量监测图形分析工具. mysqlreport是mysql性能监测时最常用的工具,对了解mysql运行状态和配置调整都有很大 ...
- Unity doesn't load, no Launcher, no Dash appears
1. 重新安装 ubuntu-desktop不起作用. Enter the following commands:- Ctrl+Alt+F1 login there by user name and ...
- hdu 4740 The Donkey of Gui Zhou(dfs模拟好题)
Problem Description There was no donkey ,) , the down-right cell ,N-) and the cell below the up-left ...
- C#泛型详解
我们在编写程序时,经常遇到两个模块的功能非常相似,只是一个是处理int数据,另一个是处理string数据,或者其他自定义的数据类型,但我们没有办法,只能分别写多个方法处理每个数据类型,因为方法的参数类 ...
- 有关ios中images.xcassets的导入图片等命名问题
最近遇到一个问题,就是在设置启动图片的时候,把启动图片命名设置为了xxx@2x.png, 然后应用死活没有显示启动图片,调试了很久,才发现是因为文件命名的原因. 1. 如果在图片的下方有2x或3x的标 ...
- OC基础14:使用文件
"OC基础"这个分类的文章是我在自学Stephen G.Kochan的<Objective-C程序设计第6版>过程中的笔记. 1.对于NSFileManager类,文件 ...
- iOS开发--系统通讯录的访问与添加联系人
公司项目有访问通讯录的需求,所以开始了探索之路.从开始的一无所知,到知识的渐渐清晰.这一切要感谢广大无私分享的 “coder”,注:我是尊称的语气! 苹果提供了访问系统通讯录的框架,以便开发者对系统通 ...
- WindowsForm 记事本 对话框
textbox: 属性: text:文本 selectedtext:获取或设置选中文本 canundo:是否能够撤销 方法: ...