javascript应用是非常广泛的,而且功能特别强大,但是javascript程序就是没有java代码好看,这点是好无疑问的,不过因为js应用太广了,在web应用中几乎离不开它,我初学js,总想像写java程序那样写js。
一个是过滤相同的元素: <script src="core.js"></script> <script src="collection.js"></script> <script> var a="74,77,74,74,89,45,45,55,89"; //"74,77,89,45,55" var arr=a.split(","); var set=new HashSet(); set.addAll(Arrays.asList(arr)); a=set.toArray(); alert(a); </script>
另一个程序完全是模拟CGI的: <script src="core.js"></script> <script src="collection.js"></script> <style> td{ font-size:12px; } th{ font-size:14px; } </style>
<body>
<table width="50%" align="center"> <tr> <td>用户名称:<input type="text" id="search_name"></td> <td><a href="#" onClick="searchUser()">查找用户</a></td> </tr> </table> <div id="list_table" align="center">
</div>
<table width="50%" align="center"> <tr> <td>用户ID:<input type="text" id="txt_id"></td> <td>用户名称:<input type="text" id="txt_name"></td> <td><a href="#" onClick="addUser()">添加用户</a></td> </tr> </table> </body> <script> function User(id,name){ this.id=id; this.name=name; this.equals=equals; function equals(obj){ return this.id==obj.id; } this.compareTo=compareTo; function compareTo(obj){ return 1; } }
function AscID(){ this.compare=compare; function compare(obj1,obj2){ if(obj1.id>obj2.id) return 1; else if(obj1.id==obj2.id) return 0; else return -1; } }
function DescID(){ this.compare=compare; function compare(obj1,obj2){ if(obj1.id>obj2.id) return -1; else if(obj1.id==obj2.id) return 0; else return 1; } }
var table=document.getElementById("list_table"); var list=new SortedList(); var buffer=new ArrayList(); buffer.add(new User("100","Heery")); buffer.add(new User("101","Marry")); buffer.add(new User("102","JIM")); buffer.add(new User("200","Bush")); buffer.add(new User("201","Eey")); buffer.add(new User("203","Boy")); buffer.add(new User("300","Oush")); buffer.add(new User("1111111","胡江涛")); buffer.add(new User("2324424","温家宝")); buffer.add(new User("24325324","刘淇")); buffer.add(new User("245325353","吴树根"));
list.setComparator(new AscID()); list.addAll(buffer); //var id_asc=true;
var pageSize=10; var curPage=1;
function getTotalPage(){ return Math.ceil((list.size()/pageSize)); } function getNavigation(){ var nav="<tr><td colspan=2>"; nav+="<a href='#' onClick='firstPage()'>首页</a> "; nav+="<a href='#' onClick='prePage()'>上一页</a> "; nav+="<a href='#' onClick='nextPage()'>下一页</a> "; nav+="<a href='#' onClick='lastPage()'>末页</a> "; nav+="总共:"+list.size(); nav+=" " nav+="页次:"+curPage+"/"+getTotalPage(); nav+=" "; nav+="每页显示:"+pageSize; nav+=" "; nav+="当前页数:"+curPage; nav+="</td></tr>"; return nav; }
function firstPage(){ curPage=1; table.innerHTML=getInnerHTML(curPage,pageSize); } function nextPage(){ if(curPage==getTotalPage()) return; table.innerHTML=getInnerHTML(++curPage,pageSize); } function prePage(){ if(curPage==1) return; table.innerHTML=getInnerHTML(--curPage,pageSize); } function lastPage(){ curPage=getTotalPage(); table.innerHTML=getInnerHTML(curPage,pageSize); } function refresh(){ if(curPage>getTotalPage()) curPage=getTotalPage(); table.innerHTML=getInnerHTML(curPage,pageSize); }
function addUser(){ var id=document.getElementById("txt_id").value; var name=document.getElementById("txt_name").value; //if(id_asc) buffer.add(new User(id,name)); list.add(new User(id,name)); refresh(); }
function searchUser(){ var key=document.getElementById("search_name").value; var com=list.getComparator(); list=new SortedList(); if(com!=null) list.setComparator(com); for(var i=0;i<buffer.size();i++){ var u=buffer.get(i); if(u.name.indexOf(key)!=-1) list.add(u); } refresh(); }
function delUser(id){ buffer.remove(new User(id,name)); list.remove(new User(id,name)); refresh(); }
function getInnerHTML(pg,size){ var s="<table width=50% align=center><tr><th id=\"user_id\" align=left width=40%>用户ID[<a href='#' onClick='descID()'>降序</a>]</th><th align=left>用户名称</th><th></td></tr>"; var first=(pg-1)*size; for(var i=0;i<size;i++){ var index=first+i; if(index>=list.size()) break; var u=list.get(index); s+="<tr><td>"; s+=u.id; s+="</td><td>"; s+=u.name; s+="</td><td>"; s+="<a href='#' onClick=\"delUser('"; s+=u.id; s+="')\">删除</a>"; s+="</td></tr>"; } s+=getNavigation(); s+="</table>"; return s; } //delay() table.innerText="loading"; function oneStep(){ table.innerText="loading.."; } function twoStep(){ table.innerText="loading...."; } function threeStep(){ table.innerText="loading........."; } function fourStep(){ table.innerText="loading............OK!"; }
function descID(){ var oldList=list; list=Collections.sort(oldList,new DescID()); refresh(); var id=document.getElementById("user_id"); id.innerHTML="用户ID[<a href='#' onClick='ascID()'>升序</a>]";
}
function ascID(){ var oldList=list; list=Collections.sort(oldList,new AscID()); refresh(); }
setTimeout("oneStep()",500); setTimeout("twoStep()",1000); setTimeout("threeStep()",1500); setTimeout("fourStep()",2000); setTimeout("firstPage()",3000); //firstPage();
</script>
[Delphi程序]李维的 Demo 中可以改进的地方 [网页制作]CSS实现简单的横向排列demo [Web开发]javascript读写cookie的一个小demo [Web开发]最近的asp.net技术demo
|