首頁 > 開發者 > Java

java方式來寫js程式(demo)

來源：互聯網
上載者：User
創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！
js|程式  

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="#" >尋找使用者</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="#" >添加使用者</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='#' >首頁</a>  ";
 nav+="<a href='#' >上一頁</a>  ";
 nav+="<a href='#' >下一頁</a>  ";
 nav+="<a href='#' >末頁</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='#' >降序</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='#' >升序</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>



本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

相關關鍵詞：
node js demo car demo java program node js vs java performance helo demo php demo vps demo jira demo
相關文章
java.imageIo給圖片添加浮水印的實現代碼

聯繫我們

該頁面正文內容均來源於網絡整理，並不代表阿里雲官方的觀點，該頁面所提到的產品和服務也與阿里云無關，如果該頁面內容對您造成了困擾，歡迎寫郵件給我們，收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容，歡迎發送郵件至： info-contact@alibabacloud.com 進行舉報並提供相關證據，工作人員會在 5 個工作天內聯絡您，一經查實，本站將立刻刪除涉嫌侵權內容。

熱門內容

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More