js实现的点击数量加一可操作数据库


<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "https://www.jb51.net/";
String groupId = request.getParameter("groupId");
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>宝宝排行榜</title>
<style type="text/css">
body {
text-align: center;
margin: 0 auto;
padding: 0;
background: #ffefe5;
width: 100%;
}

a:link {
text-decoration: none;
}

#static {
margin: 0 auto;
text-align: left;
}

img {
width: 100%;
}

#main {
background: url("../pic/bj_12.jpg") repeat-x;
padding-top: 5px;
}

#main span {
font-size: 1.5em;
color: #2f0075;
margin-left: 40px;
}

#bottom {
width: 100%;
margin: 0;
padding: 0;
font-size: 1em;
}

#bottom ul li {
width: 48%;
float: left;
margin-left: -8%;
margin-right:10%;
list-style-type: none;
}
.sp {
margin-top: -50px;
border-radius: 8px;
}
</style>
<script type="text/javascript">
$(function(){
//动态加载宝贝排行信息
function loadSecondSort() {
$.ajax({
type : "POST",
data : "groupId="+$("#groupId").val(),
url : "<%=basePath%>findBobyRankByVote.action",
success : function(data) {
var list = data.list;
var row = "";
$("ul").empty();
if (list != null && list.length != 0) {
for(var i=0;i<list.length;i++) {
row = "<li><a href=https://www.jb51.net/article/\"bao_x.jsp?id="+list[i].id+"https://www.jb51.net/article/\"> <img src=https://www.jb51.net/article/\"../pic/"+list[i].pic+"https://www.jb51.net/article/\"></a><input type=https://www.jb51.net/article/\"hidden\" id=https://www.jb51.net/article/\"id\" value="+list[i].id+"><div class=https://www.jb51.net/article/\"sp\""+
"style=https://www.jb51.net/article/\"background-color: #ffb7cd; margin-top: 10px; height: 30px\">"+
"<img src=https://www.jb51.net/article/\"../pic/zan.png\" style=https://www.jb51.net/article/\"width: 22px; margin-left: 10px; margin-top: 5px;\" class=https://www.jb51.net/article/\"favour\">"+
"<span style=https://www.jb51.net/article/\"margin-top: 5px; color: #8a7da9; float: right; margin-right: 10px;\">已<span>"+list[i].vote+"</span>票"+
"</span></div></li>";
$(row).appendTo($("ul"));
}
}
}
});
}
$(".favour").live("click",function(){
var id = $(this).closest("li").find("#id").val();
$.post("<%=basePath%>updateBobyRank.action", "id=" + id,
function(data) {
if (data.msg==null){
if (data.success == true) {
loadSecondSort();
}
}else {
alert(data.msg);
}
});
});
window.onload = loadSecondSort();
});
</script>
</head>
<body>
<input type="hidden" value="<%=groupId%>">
<div>
<img src="https://www.jb51.net/pic/top10.jpg"> <a href="https://www.jb51.net/jsp/index.jsp"><img
src="../pic/fan.png"></a>
<div>
<span>近期排名:</span>
</div>
<div>
<ul>
</ul>
</div>
</div>
</body>
</html>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgpxpy.html