用Repeater绑定数据,点赞功能,老大催着要,也没有太大的访问量暂时没写 数据并发

后台写方法读出点赞数据

开始写jQuery

//jquery基本语法就不细说了

<script type="text/javascript">
    $(function(){
    $(".img_zan").mouseover(function(){
      $(this).children().attr("src","images/t_fwsc/Thumb_mouseover1.png");
    });
      $(".img_zan").mouseout(function(){
       $(this).children().attr("src","images/t_fwsc/s-4.png");
    });
    $(".img_zan").click(function(){   
      $(this).children().attr("src","images/t_fwsc/Thumb_up2.png");
//      $(".add0").removeClass("add_1");
//      $(".add0").addClass("add_piao");
//      $(".add0").animate({top:"-100px",opacity:'0'},"slow");

/******************************加一样式开始******************************/
    $(this).next().children().children().next(".add0").removeClass("add_1");
    $(this).next().children().children().next(".add0").addClass("add_piao");
    $(this).next().children().children().next(".add0").animate({top:"-200px",opacity:'0'},"slow");

/******************************加一样式开始******************************/
      var _a= parseInt($(this).next().text());//当前点赞数
      var b="1";//嘻嘻,命名不规范了,测试用的
      var masterId=$("#MasterId").val();//用户Id
      var orgId=$(this).siblings("#OrgId").val();//联盟医院Id

//之前接触过Ajax,好久不写前端快忘干净了,看了看Jquery的API  ----》》》http://www.w3school.com.cn
     $.ajax({
     url:"/ashx/MasterPraiseAjax.ashx",   //发送请求的地址 Get请求方式
     data:{WebName:b,masterId:masterId,OrgId:orgId},//参数 必须以键值对传递 master
     async:false,//类型:Boolean 默认值: true。默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。

     success:function(data){ //返回值

     if(data=="-1")//未登录情况下跳转
     {
      location.href = "Login.aspx"; //location.href实现客户端页面的跳转  
     
     }else if(data=="1"){ //点赞
       _a+=1;
      //alert(data);
     }else if(data=="0"){ //取消点赞
       _a-=1;
      
     }else{
      _a+=1;
      
     }
   
     }
     });
    
      $(this).next().children().text(_a);//给点赞数量重新赋值 (+1or-1)
 
$(this).removeClass("img_zan").addClass("img0");
$(this).next().removeClass("zanshu").addClass("zanshu0");
    });
     
     });
    </script>


//下面是一般处理程序

using System;
using System.Collections;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.Web.SessionState;
using Common;
using Model.Linq;

namespace Web.ashx
{
    /// <summary>
    /// $codebehindclassname$ 的摘要说明
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class MasterPraiseAjax : IHttpHandler, IReadOnlySessionState
    {

public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";

//Ajax传递的参数值
            string a = context.Request.QueryString["WebName"];
            string masterId = context.Request.QueryString["masterId"];
            string orgId = context.Request.QueryString["orgId"];
            try
            {
                if (masterId.IsNullOrEmptyOrWhiteSpace())
                {
                    context.Response.Write("-1");
                }
                else
                {

//一下就是点赞状态的操作的  数据量大的话不建议用如下写法,之后会研究一下 并发点赞  偷了懒了
                    if (!a.IsNullOrEmptyOrWhiteSpace())
                    {
                        phDataContext ph = new phDataContext();
                        PetMasterPraise prais = ph.PetMasterPraise.Where(p=>p.PetMasterId==Convert.ToInt32(masterId)&&p.SourceId==Convert.ToInt32(orgId)&&p.SourceType==2).FirstOrDefault();
                        //点赞
                        if (prais == null)
                        {
                            PetMasterPraise praise = new PetMasterPraise();
                            praise.PetMasterId = Convert.ToInt32(masterId);
                            praise.SourceId = Convert.ToInt32(orgId);
                            praise.SourceType = 2;
                            praise.CreateDate = DateTime.Now;
                            praise.State = 1;
                            praise.Title = "联盟点赞";
                            ph.PetMasterPraise.InsertOnSubmit(praise);
                            ph.SubmitChanges();
                            context.Response.Write(praise.State);

}
                            //点赞
                        else if (prais.State == 0)
                        {
                            prais.State = 1;
                            ph.SubmitChanges();
                            context.Response.Write(prais.State);

}
                        else
                        {
                            //取消点赞
                            prais.State = 0;
                            ph.SubmitChanges();
                            context.Response.Write(prais.State);

}

}
                }
            }
            catch (Exception ex)
            {

LogHelper.WriteLog("联盟点赞异常",ex);
            }
            
        }

public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}


<div style="height: 30px; width: 150px; float: left; border: 0px;">

<input type="hidden" id='OrgId' value='<%#Eval("Id") %>' />
            <div class="img_zan">  
            <img src="data:images/t_fwsc/s-4.png" /></div>
             <div style="height: 30px; width: 60px; float: left; border: 0px;">
               <span class="zan_span"><span class="zanshu"><%# StarCount(Eval("Id"),2) %></span><span class="add_1 add0">+1</span>
              </span>
              </div>
                <input type="hidden" runat="server" id="hidPar" value="" />
                <div style="height: 30px; width: 20px; float: left; border: 0px;">
                 </div>
                   <div style="height: 30px; line-height: 30px; width: 40px; float: left; border: 0px;">
                     点赞
                   </div>
                   </div>

小白一枚  写的多有不合理的地方会慢慢改进...


ajax点赞功能的更多相关文章

  1. JavaScript cookie操作实现点赞功能

    JavaScript cookie操作实现点赞功能 参考实现原理,但是代码不够简洁,简洁代码参考:js操作cookie 实现一个点赞功能十分简单,主要问题在于不能重复点赞.  若是一个有用户的网站,可 ...

  2. div中加入iframe,可以实现Ajax的功能

    div中加入iframe,可以实现Ajax的功能,如果查询的时候,比如说城市的选择,用Ajax去实现, 在.net 可以考虑用UpdatePanel,但是点击了查询刷新表格(表格需要重新刷新加载,非纯 ...

  3. JavaScript实现评论点赞功能

    通过分析评论功能的逻辑关系,学会如何使用JavaScript实现评论.回复.点赞等各种功能 1.学会JavaScript处理日期和时间. 2.掌握Dom操作中的添加/删除子节点方法. 3.使用setT ...

  4. 基于微信小程序的用户列表点赞功能

    代码地址如下:http://www.demodashi.com/demo/13997.html 一.前言 (1).适合人群 1.微信小程序开发者 2.前端工程师 3.想入门学习小程序开发的人员 4.想 ...

  5. 全栈项目|小书架|微信小程序-点赞功能实现

    微信小程序端的点赞功能其实没什么好介绍的,无非就是调用接口改变点赞状态和点赞数量.需要注意的是取消点赞时的处理,我这里为了减少服务器接口的调用,直接本地存一个变量,修改这里的变量值即可. 由于源码都相 ...

  6. 全栈项目|小书架|服务器端-NodeJS+Koa2 实现点赞功能

    效果图 接口分析 通过上面的效果图可以看出,点赞入口主要是在书籍的详情页面. 而书籍详情页面,有以下几个功能是和点赞有关的: 获取点赞状态 点赞 取消点赞 所以项目中理论上与点赞相关的接口就以上三个. ...

  7. 项目:jSon和Ajax登录功能

    组件化网页开发 / 步骤二 · 项目:jSon和Ajax登录功能 要熟练编写封装的$.ajax({........})

  8. Day8-微信小程序实战-交友小程序-首页用户列表渲染及多账号调试及其点赞功能的实现

    在这之前已经把编辑个人的所有信息的功能已经完成了 之后先对首页的列表搞动态的,之前都是写死的静态 1.之前都是把好友写死的,现在就在js里面定义一个数组,用循环来动态的绑定 在onReady中定义,取 ...

  9. JavaWeb网上图书商城完整项目--day02-6.ajax校验功能之页面实现

    1 .现在我们要在regist.js中实现ajax的功能,使用用户名到后台查询是否注册,邮箱是否到后台注册,验证码是否正确的功能 我们来看regist.js的代码 //该函数在html文档加载完成之后 ...

随机推荐

  1. C# Winform 通过FlowLayoutPanel及自定义的编辑控件,实现快速构建C/S版的编辑表单页面

    个人理解,开发应用程序的目的,不论是B/S或是C/S结构类型,无非就是实现可供用户进行查.增.改.删,其中查询用到最多,开发设计的场景也最为复杂,包括但不限于:表格记录查询.报表查询.导出文件查询等等 ...

  2. T-SQL删除重复数据

    数据重复分为两种情况:一种是每个字段都相同的完全重复,第二种是部分字段重复的结果集.比如Name字段重复,而其他字段不一定重复或者重复可以忽略. 第一种情况比较容易解决,使用select distin ...

  3. C# 各种字符串格式

    C#的String.Format举例 stringstr1 =); //result: 56,789.0 stringstr2 =); //result: 56,789.00 stringstr3 = ...

  4. MEF入门之不求甚解,但力求简单能讲明白(三)

    上一篇我们已经获得了制定类型的实例,但我们还无法对其进行有效的控制. 我们用ExportMetadata属性可以对具体的某个实例做标记,相当于命名.这么理解不知道对否. 在IPart项目中添加一个接口 ...

  5. 百度地图自定义Marker

    最近写了百度地图的Demo,所以总结下遇到的问题: 1.首先在百度地图中创建应用时用到 发布版SHA1是在Preferences下的Android下的Build中;2.在使用百度地图时,先要创建一个A ...

  6. Mybatis中注解@MapKey的使用

    在研究Mybatis源码之前并不知道这个注解的妙用的,但是当我看到参数解析的时候 有这个一个注解,所以我了解了一下,当我们返回像Map<String, Map<String, Object ...

  7. MongoDB学习-安装流程

    MongoDB是一个介于关系数据库和非关系数据库之间的产品,是非关系数据库当中功能最丰富,最像关系数据库的. 支持的数据结构非常松散,是类似json的bjson格式,因此可以存储比较复杂的数据类型. ...

  8. IOS 集成第三方登录

    我使用的是友盟上集成的第三方登录功能,一共使用了三个应用的登录授权,QQ.微信.新浪微博.由于第三方登录授权成功后,需要跳转到一个新的界面,所以这里需要在项目里设置第三方登录的SSO授权.就是必须安装 ...

  9. 项目总结笔记系列 Maven Session1

    主题:Maven 参考地址: 1.http://www.yiibai.com/maven/ 2.http://www.icoolxue.com/ 目录 1.环境搭建 2.pom.xml文件解析 3.m ...

  10. 项目总结笔记系列 Social Hub KT Session2

    KT Session2: 主要是代码的实现(KT is knowledge Transfer) 如图所示,在整个Social Hub项目中,我们的项目Data Feed Service处于承上启下的作 ...