个人征信系统完成,花了一天时间导入了N多人的数据,自我欣赏了好几天,把所有认识的人都查了一下。难过的准确率,和不太满意的查找率。这是数据质量的问题不说了…… 后台还是使用asp写的,但是程序构成方法有了很大的转变,过去html直接加入asp代码的日子已经结束了。使用了所谓的webservices使后台编程的难度降低了很多,也减轻了服务器的负担。在这个ws里我使用了很简单的rest协议。通过这个协议,简单实现整个流程,发送一个id=****,获得一个xml文档回执,问题变得如此简单了,前台用javascript 获得数据一一放入到需要的地方。这种方法唯一会让人感到高兴的是:看到的页面都是.htm
两段代码
1、所有的事情交给浏览器做,当然页面间的全局变量最好的方法是Cookie。这样服务器获得数据后,无论什么页面随用随取,自由自在。
// 网上抄的 function SetCookie(name,value) // 两个参数,一个是cookie的名子,一个是值 ... { var Days = 1 ; // 此 cookie 将被保存 1 天 var exp = new Date(); // new Date("December 31, 9998"); exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000 ); document.cookie = name + " = " + escape (value) + " ;expires= " + exp.toGMTString(); } function getCookie(name) // 取cookies函数 ... { var arr = document.cookie.match( new RegExp( " (^| ) " + name + " =([^;]*)(;|$) " )); if (arr != null ) return unescape(arr[ 2 ]); return null ; } function delCookie(name) // 删除cookie ... { var exp = new Date(); exp.setTime(exp.getTime() - 1 ); var cval = getCookie(name); if (cval != null ) document.cookie = name + " = " + cval + " ;expires= " + exp.toGMTString(); } // SetCookie ("xiaoqi", "3") //alert(getCookie('xiaoqi'));
2、数据翻页代码 做成了 [上一页][1][2][3][4][5][6][7][8][下一页] 这类形式翻页只是对小数据量最好,我的100条数据很快,打数据量还是按原始方法,传来数据分成10页,无刷新翻页,速度自然是快的惊人。
function ToPage(oArg) ... { var oSize, oCount, oPosition, strList = '' ; var oTarget = oArg; var oTable = document.all[ ' oTable ' ]; var oData = document.all[ ' oData ' ]; var oRecordSet = oData.recordset; oSize = oTable.dataPageSize; oRecordSet.PageSize = oSize; oCount = oRecordSet.PageCount; oPosition = oRecordSet.AbsolutePage; if (oTarget < 1 ) ... { oTarget = 1 ; } if (oTarget > oCount) ... { oTarget = oCount; } while (oPosition != oTarget) ... { if (oPosition < oTarget) ... { oRecordSet.AbsolutePage ++ ; oPosition = oRecordSet.AbsolutePage; oTable.nextPage(); } else ... { oRecordSet.AbsolutePage -- ; oPosition = oRecordSet.AbsolutePage; oTable.previousPage(); } } var oPage = document.all[ ' oPage ' ]; for ( var i = 1 ; i <= oCount; i ++ ) ... { strList += ' [<a href= "javascript:ToPage( ' + i + ' ); void 0;" class="a"> ' ; strList += (oRecordSet.AbsolutePage != i) ? i : ' <b> ' + oRecordSet.AbsolutePage + ' </b> ' ; strList += ' </a>] ' ; } if (oRecordSet.AbsolutePage > 1 ) ... { strList = ' [<A HREF="javascript:ToPage( ' + (oRecordSet.AbsolutePage - 1 ) + ' ); void 0;" class="a">上一页</A>] ' + strList } if (oRecordSet.AbsolutePage != oCount) ... { strList = strList + ' [<A HREF="javascript:ToPage( ' + (oRecordSet.AbsolutePage + 1 ) + ' );void 0;" class="a">下一页</A>] ' } // strList = strList.substr(0, strList.length-12); oPage.innerHTML = strList; } function setList() ... { var oSize, oCount, strList = '' ; var oTable = document.all[ ' oTable ' ]; var oData = document.all[ ' oData ' ]; var oRecordSet = oData.recordset; oSize = oTable.dataPageSize; oRecordSet.PageSize = oSize; oCount = oRecordSet.PageCount; var opagecount = document.all[ ' opagecount ' ]; $( ' opagecount ' ).innerHTML = ' 搜索共得到<font color="#FF0000"> ' + oRecordSet.recordcount + ' </font>个结果,共<font color="#FF0000"> ' + oCount + ' </font>页 ' ; var oPage = document.all[ ' oPage ' ]; for ( var i = 1 ; i <= oCount; i ++ ) ... { strList += ' [<a href="javascript:ToPage( ' + i + ' ); void 0;" class="a"> ' ; strList += (oRecordSet.AbsolutePage != i) ? i : ' <b> ' + i + ' </b> ' ; strList += ' </a>] ' ; } if (oCount > 1 ) ... { strList = strList + ' [<A HREF="javascript:ToPage( ' + (oRecordSet.AbsolutePage + 1 ) + ' ); void 0;" class="a">下一页</A>] ' } // strList = strList.substr(0, strList.length-12); oPage.innerHTML = strList; } // <table id="oTable" width="90%" align="center" border="0" cellPadding="0" cellSpacing="0" dataSrc="#oData" dataPageSize="10"> // <span id="oPage"></span>
获取数据使用了ajax,这样会让用户感觉上速度很快。prototype 1.5使用让我节约了不少时间,而且在学习中时刻震惊js的强大。
var quest = location.search.replace( / ?/ g, "" ) // 从获得的url中度群参数部分,可在split来获取每一个 function getXML() ... { $( ' oTable ' ).style.visibility = " hidden " ; var url = ' asp/resaultin.asp ' ; var pars = quest; var myAjax = new Ajax.Updater( ' myxml ' , url, ... { method: ' get ' , parameters: pars, onComplete:onready } ); }
js的事件和windows里很像,所以发现以前学习的东西还是很有用的。prototype直接一句话
Event.observe(document, ' datasetchanged ' , showMessage, false ); function showMessage() ... { $( ' oTable ' ).style.visibility = " visible " ; }
最后用了别人的tab 控件,日期控件,和lightbox--thicjbox--最后换成greybox 效果虽然还觉得有点差异,不过已经很满意了。