기사 주제 학습 다운로드 Q&A 프로그래밍 사전 게임 최근 업데이트

简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)

집 > 웹 프론트엔드 > JS 튜토리얼 > 본문

jQuery ajax는 엄지손가락 위로 및 아래로 엄지손가락의 효과를 실현합니다_jquery

WBOY

풀어 주다： 2016-05-16 18:22:59

원래의

1350명이 탐색했습니다.

데모 페이지 구현

코드 복사 코드는 다음과 같습니다.

이 문서는 좋습니다.
< div class="bar">

스팬 클래스= "num" id="num">70%(7000)

문서 개선 필요

30%(3000)

가장 중요한 점은 g_img의 너비를 백분율로 조절하는 것입니다.
데모 코드:

코드 복사 코드는 다음과 같습니다.

Digg

;

문서가 양호합니다< ;/p>

;/div>
70%(7000)

"나쁜"

문서 개선 필요

"b_img " style="width:30%">

30%(3000) ;/ a>

데모를 사용하면 훨씬 더 쉽습니다. 먼저 페이지가 html을 가져옵니다. 페이지가 처음 로드될 때 ajax를 사용하여 배경 데이터를 직접 표시하지 않습니다. (여기서는 테스트의 편의를 위해 배경언어로 asp를 사용했습니다.)
다음은 asp 출력 html 코드입니다

코드 복사

코드는 다음과 같습니다.
sql="select * from dig where id=1"

rsajax.open sql,conn,1,1
digsnum=rsajax("digs")
undigsnum=rsajax("undigs")
if isnull(digsnum)이면 digsnum=0
if isnull(undigsnum)이면 undigsnum=0
digsnumdigsnumall=digsnum undigsnum
if digsnumall=0이면
digsper=0
undigsper=0
else
digsper=FormatNumber(cint(digsnum)/cint(digsnumall),3)*100
undigsper=FormatNumber(cint(undigsnum)/cint(digsnumall),3)*100
end if
str="

"
strstr=str&""
strstr=str&"

这个文档不错

< ;/div>

"
strstr=str&""&digsper&"%("&digsnum&")"
strstr=str&"

"
strstr=str&""
strstr=str&"

文档有待改进

< ;/div>

"
strstr=str&""&undigsper&"%("&undigsnum&")"
strstr=str&"

"
getdigshtml=str
종료 기능

输ute完了接下来就是前台获取，这时候我们就要用到jquery ajax，为什么不直接用ajax，原因很简单，我不会。。。。。看一下jquery中ajax代码，很简单

复主代码

代码如下: function getdigshtml()//获取顶一下，踩一下html { $.ajax({

type:'POST',

url:'digg.asp', 
data:'action=getdigshtml', 
success:function(msg){ 
$("#digg").html(msg); 
} 
}) 
} 

 
输了完了，接下来一步就是digs and unigs的操work了，跟获取html代码差不多 

复代代码

代码如下: function isdigs(digtype)//顶一下，踩一下操작 { $.ajax({

type:'POST',

url:'digg.asp', 
data:'action=digs&digtype=' digtype, 
/* beforeSend:function(){ 
$("#vote").hide() 
$("#loadings").show(); 
}, ajax请求显示loading效果*/ 
success:function(msg){ 
스위치(msg) 
{ 
 /* 后台用来判断 
case '1': 
$("#loadings").hide() 
$("#vote").show() 
alert("请先登录!"); 
break; 
case '2': 
$("#loadings").hide(); 
$("#vote").show(); 
alert("请先下载，再操작품!"); 
break 
case '4': 
$("#loadings").hide(); #vote").show(); 
alert("您已经参与过评价!"); 
break;*/ 
case '3': 
getdigshtml();//중신규정html 
//$("#loadings").hide(); 
//$("#vote").show(); 
alert("알람이 없습니다!"); 
휴식; 
기본값: 
} 
} 
}) 
} 

 
注释掉的代码: 一part分是后台数据합법验证사용용，beforeSend这个方法是ajax请求执行前交关操작품(사용于做loading比较多) 
最后一步就是，每次数据提交完并且成功返回，getdigshtml()% , 这样就保证了数据的实时性. 
演示代码需要asp环境,大家可以测试下。
打包下载地址： 
http://www.jb51.net/jiaoben/28489.html