【ASP】英语九百句-ASP输出JSON，AJAX异步请求到本地存储localstorage

来源：互联网发布：知乐全集百度云编辑：程序博客网时间：2024/06/07 08:08

english.mdb英语九百句示例。

english.ASP连接数据库，并以JSON格式输出数据。

english.HTML使用jQuery的AJAX异步请求获取JSON格式的英语九百句数据，并将其进行本地存储localstorage。

1.定时随机输出一条中英对照语句。

2.jQuery分页输出全部记录。

---------------------------------------------

english.ASP

<%@CODEPAGE="65001"%><%Response.charset="utf-8"Set conn = Server.CreateObject("ADODB.Connection")conn.provider="sqloledb"conn.open "server=192.168.1.100; uid=sa; pwd=123;Database=test"Set rs=Server.CreateObject("ADODB.RecordSet")rs.open "select * from english",conn,1,1total=rs.recordcount'==输出JSON格式数据=============='json封装时需要注意干扰符号",[]{}之类的。需要对其进行编码解码。'Response.Write("{""total"":""92"",""content"":[")Response.Write("[")For i=0 To total-1Response.Write("{")For j=0 To rs.fields.count-1Response.Write(""""&rs(j).name&""":"""&escape(rs(j))&"""")IF (j<rs.fields.count-1) Then Response.Write(",")NextResponse.Write("}")If i<total-1 Then Response.Write(",")rs.movenextNextResponse.Write("]")%>

english.HTML

<!DOCTYPE html><html > <head>  <title> 英语九百句--ajax/localstorage </title>  <meta charset="utf-8">  <script src="/js/jquery-1.11.3.min.js" type="text/javascript"></script> </head><script type="text/javascript">var local_content;//获取当前localstorage数量：localStorage.length//获取localstorage各个名称：localStorage.key(2)//获取localstorage变量内容：localStorage.getItem("xxxx")//删除localstorage变量：localStorage.removeItem("xxxx")//清除localstorage：localStorage.clear();//alert(localStorage.getItem("content"));//javascript 大小写敏感：对象、数组、变量、字段名//json封装时需要注意干扰符号",[]{}之类的。需要对其进行编码escape解码unescape。$(function(){if (localStorage.getItem("content")==null ){setstorage("content");}else{local_content= JSON.parse(localStorage.getItem("content"));rnd_list();}});function setstorage(id){$.getJSON("ss.asp",function(data){localStorage.setItem(id,JSON.stringify(data));  });}function rnd_list(){var n=Math.floor(Math.random()*local_content.length);$("#res").html(unescape(local_content[n].English)+"<br>"+unescape(local_content[n].Chinese));setTimeout(function(){rnd_list();},3000);}</script> <body> <div id="res" ></div> </body></html>

0 0