찾다
php教程php手册php+mysql结合Ajax实现点赞功能完整实例

这篇文章主要介绍了php+mysql结合Ajax实现点赞功能,以一个完整实例形式详细分析了实现点赞功能中涉及的html页面、Ajax功能及php方法的使用技巧,非常具有实用价值

本文实例讲述了php+mysql结合Ajax实现点赞功能的方法。分享给大家供大家参考。具体如下:

要实现点赞功能,有多种实现方式,这里总结一下利用Ajax,php和mysql来实现点赞的数据的功能。具体步骤如下:

一、页面中的HTML代码部分:

0 0 0 0

二、写javascript

1、实现上面的button的点击事件goodplus

var span = document.getElementsByTagName('span');//获取存放点赞数的dom var num; //点赞数 var flag = 0; //不同情况的标记 function goodplus(gindex){ flag = 1; num = parseInt(span.item(gindex-1).innerHTML); if(checkcookie(gindex) == true){ num = num + 1; senddata(gindex); //通过Ajax修改页面上的数据 }else{ alert("你已经点过赞咯!") } }

2、页面一打开时就应该更新点赞数据

for(var i = 1; i

3、通过Ajax获取数据senddata函数

function senddata(aindex){ var xmlhttp; var txt; if(window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest(); }else{ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function(){ if(xmlhttp.readyState == 4 && xmlhttp.status == 200){ txt = xmlhttp.responseText; //获取返回的数据 var cookieindex = aindex - 1; document.getElementsByTagName('span').item(cookieindex).innerHTML = txt; //赋值 } } xmlhttp.open("GET","路径/index.php?num=" + num + '&flag=' + flag + '&aindex=' + aindex,true); xmlhttp.send(); }

4、通过设置cookie来判断是否已经点赞,如果有cookie则提示已经点赞,如果没有cookie则允许点赞,而且会设置cookie

//判断是否已经存在了cookie function checkcookie(gindex){ var thiscookie = 'goodplus' + gindex; var mapcookie = getCookie(thiscookie) if (mapcookie!=null && mapcookie!=""){ return false; }else { setCookie(thiscookie,thiscookie,365); return true; } } //获取cookie function getCookie(c_name){//获取cookie,参数是名称。 if (document.cookie.length > 0){//当cookie不为空的时候就开始查找名称 c_start = document.cookie.indexOf(c_name + "="); if (c_start != -1){ //如果开始的位置不为-1就是找到了、找到了之后就要确定结束的位置 c_start = c_start + c_name.length + 1 ; //cookie的值存在名称和等号的后面,所以内容的开始位置应该是加上长度和1 c_end = document.cookie.indexOf(";" , c_start); if (c_end == -1) { c_end = document.cookie.length; } return unescape(document.cookie.substring(c_start , c_end));//返回内容,解码。 } } return ""; } //设置cookie function setCookie(c_name,value,expiredays){ //存入名称,值,有效期。有效期到期事件是今天+有效天数。然后存储cookie, var exdate=new Date(); exdate.setDate( exdate.getDate() + expiredays ) document.cookie = c_name + "=" + escape(value) + ((expiredays==null) ? "" : "; expires=" + exdate.toGMTString()) }

三、index.php页面:

四、最终的index.html页面如下:

성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

인기 기사

R.E.P.O. 에너지 결정과 그들이하는 일 (노란색 크리스탈)
3 몇 주 전By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 최고의 그래픽 설정
3 몇 주 전By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 아무도들을 수없는 경우 오디오를 수정하는 방법
3 몇 주 전By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25 : Myrise에서 모든 것을 잠금 해제하는 방법
3 몇 주 전By尊渡假赌尊渡假赌尊渡假赌

뜨거운 도구

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

Atom Editor Mac 버전 다운로드

Atom Editor Mac 버전 다운로드

가장 인기 있는 오픈 소스 편집기

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

ZendStudio 13.5.1 맥

ZendStudio 13.5.1 맥

강력한 PHP 통합 개발 환경

에디트플러스 중국어 크랙 버전

에디트플러스 중국어 크랙 버전

작은 크기, 구문 강조, 코드 프롬프트 기능을 지원하지 않음