jQuery写的简单投票

最新推荐文章于 2020-07-28 20:35:05 发布

聆天鸣

最新推荐文章于 2020-07-28 20:35:05 发布

阅读量1k

点赞数

分类专栏：技术文章标签： jquery xmlhttprequest function exception class action

本文链接：https://blog.csdn.net/xieyun1977/article/details/5713770

版权

技术专栏收录该内容

35 篇文章 0 订阅

订阅专栏

我花了半天，只用区区200多行代码就完成了这个投票功能，可谓jQuery的强大！

前提：jQuery.js和两张背景图

table DDL：

create table T_VOTE
(
TITLEID NUMBER,
GOOD NUMBER,
BAD NUMBER
)

代码如下：

<%@ page language="java" pageEncoding="UTF-8"%>
<%@page import="java.sql.ResultSet,java.util.*"%>

<%!

//数据连接池，提供的connection可自行替换掉

com.mchange.v2.c3p0.ComboPooledDataSource cds;

private void initCDS()
{
try{
cds=new com.mchange.v2.c3p0.ComboPooledDataSource();
cds.setDriverClass("oracle.jdbc.driver.OracleDriver");
cds.setUser("demo");
cds.setPassword("demo");
cds.setJdbcUrl("jdbc:oracle:thin:@127.0.0.1:1521:DEMO");
cds.setMinPoolSize(10);
cds.setAcquireIncrement(10);
cds.setInitialPoolSize(30);
cds.setMaxIdleTime(1000);
}catch(Exception e)
{e.printStackTrace();}
}
%>

String action=request.getParameter("action");
String titleId=request.getParameter("titleId");

//初始化
if(cds==null)
initCDS();

java.sql.Connection conn=null;
ResultSet rs= null;
String sql="select good,bad from T_VOTE where titleid="+titleId;

try{
//初始获得点击数
if(request.getMethod().toUpperCase().equals("GET"))
{
  conn=cds.getConnection();
  //System.out.println("Sql>>>>>>>>"+sql);
  rs= conn.createStatement().executeQuery(sql);
  //如果有记录
  if(rs.next())
  {
   //System.out.println("GOOD>>>>>"+rs.getInt("GOOD"));
   request.setAttribute("GOOD",rs.getInt("GOOD"));
   request.setAttribute("BAD",rs.getInt("BAD"));
  }
  else
  {
   request.setAttribute("GOOD",0);
   request.setAttribute("BAD",0);
  }
}

//如果提交动作，且文章Id不为空，插记录
if(action!=null&&titleId!=null&&request.getMethod().toUpperCase().equals("POST"))
{
String sid=request.getSession().getId();
ArrayList tids=null;
if(session.getAttribute("titleId")==null)
{
  tids=new ArrayList();
  tids.add(titleId);
  session.setAttribute("titleId", tids);
}
else //session中存在titleId
{
  tids=(ArrayList)session.getAttribute("titleId");
  if(tids.contains(titleId))
  {
   out.println("已提交过，不能重复提交！");
      return;
    }
    else tids.add(titleId);
    }

conn=cds.getConnection();
rs= conn.createStatement().executeQuery(sql);
String isql="";
//有记录,update
if(rs.next())
{
  if(action.equals("good"))
   isql="update T_VOTE set GOOD=GOOD+1 where TITLEID="+titleId;
  else if(action.equals("bad"))
   isql="update T_VOTE set BAD=BAD+1 where TITLEID="+titleId;
}
else
{
  if(action.equals("good"))
   isql="insert into T_VOTE(TITLEID,GOOD,BAD) values("+titleId+",1,0)";
  else if(action.equals("bad"))
   isql="insert into T_VOTE(TITLEID,GOOD,BAD) values("+titleId+",0,1)";
}
rs.close();
conn.createStatement().executeUpdate(isql);

//再次查询
rs= conn.createStatement().executeQuery(sql);
//如果有记录
if(rs.next())
{
//return "OK|GOOD|BAD"
  out.println("OK|"+rs.getInt("GOOD")+"|"+rs.getInt("BAD"));
}
else
{
  out.println("ERROR");
}
return;
}
}
catch(Exception e)
{
  System.out.println(e.getMessage());
}
finally{
  try{
  rs.close();
  conn.close();
  }catch(Exception e){}
}

%>
<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=UTF-8">
<script src="js/jquery.js" type="text/javascript"></script>

<STYLE type=text/css>BODY {
FONT-SIZE: 12px; MARGIN: 0px
}
.diggArea .diggNum {
MARGIN-TOP: 9px; DISPLAY: block; FONT-WEIGHT: bold; FONT-SIZE: 18px; WIDTH: 54px; FONT-FAMILY: Georgia; HEIGHT: 34px; TEXT-ALIGN: center
}
.diggArea .t12 {
PADDING-TOP: 12px
}
.diggArea .diggLink {
DISPLAY: block; WIDTH: 54px; COLOR: #999; TEXT-ALIGN: center
}
.diggArea .diggLink A {
WIDTH: 50px; COLOR: #222
}
.diggArea .diggLink A:visited {
COLOR: #222
}
.diggArea .diggLink A:hover {
COLOR: #f0f
}
DL.digg-row1 DT {
BACKGROUND: url(img/vote1.gif) no-repeat; FLOAT: left; MARGIN: 2px 2px 0px; WIDTH: 54px; COLOR: #a5580c; HEIGHT: 70px
}
DL.digg-row2 DT {
BACKGROUND: url(img/vote2.gif) no-repeat; FLOAT: left; MARGIN: 2px 2px 0px; WIDTH: 54px; COLOR: #0c0ca5; HEIGHT: 70px
}
</STYLE>

<SCRIPT language=JAVASCRIPT>
function document.onkeydown()
{
if ((event.ctrlKey)&&(event.keyCode==78))
event.returnValue=false;
}
document.οncοntextmenu=new Function("event.returnValue=false;");
document.onselectstart=new Function("event.returnValue=false;");

$(document).ready(function() {
$("a").click(function() {
  var actId=$(this).attr("id");
  var titleId=$("#title").val();
  $.ajax({
            type:"POST",
            url:"Vote.jsp",
            dataType:"html",
            data:"action="+actId+"&titleId="+titleId,
            beforeSend:function(XMLHttpRequest)
                {
                    $("#showResult").text("正在提交．．．");
                    //Pause(this,100000);
                },
            success:function(msg)
                {
                var msgs=msg.split('|');
                    $("#showResult").html(msgs[0]);
                    $("#showResult").css("color","red");
                    $("#glab").html(msgs[1]);
                    $("#blab").html(msgs[2]);
                },
           complete:function(XMLHttpRequest,textStatus)
                {
                    //隐藏正在查询图片
                },
          error:function()
               {
               alert("发生错误，不能提交！");
                    //错误处理
               }
            });

});
});

</SCRIPT>
<BODY>
<input type="hidden" id="title" value="<%=request.getParameter("titleId")%>" />
<DL class=digg-row1>
<DT class=diggArea>
<DIV class=diggNum><label id="glab"><%=request.getAttribute("GOOD")%></label></DIV>
<DIV class="diggLink t12"><SPAN id=dingv><A id="good" title=顶一下
href="#">有帮助</A></SPAN></DIV></DT></DL>
<DL class=digg-row2>
<DT class=diggArea>
<DIV class=diggNum><label id="blab"><%=request.getAttribute("BAD")%></label></DIV>
<DIV class="diggLink t12"><SPAN id=caiv><A id="bad" title=踩一下
href="#">没帮助</A></SPAN></DIV></DT></DL>
<div id="showResult"></div>
</BODY></HTML>