Prototype is a JS class library that simplifies Ajax development.
Official Address: http://prototype.conio.net/
Introduction: https://compdoc2cn.dev.java.net/prototype/html/prototype.js.cn.html
DHTML history is a JS class library that uses Hash (that is, the part after # in the URL) as a pointer to save data.
Official Address: http://codinginparadise.org/projects/dhtml_history/
Introduction: http://www.matrix.org.cn/resource/article/43/43972_AJAX.html
Prototype can help us develop Ajax applications more quicklyProgramBut the Ajax program has a disadvantage. Because the page is not refreshed, you cannot use forward and backward to browse the data in the past.
Dhtml_history helps us solve this problem. It records Ajax data by combining window. Location. Hash and an IFRAME.
In addition to the JS file, the official package contains a very important file named "blank.html. This file is required in some browsers. You must put it in the same level directory of your application.
Here is an example (note:Code):
Index.html
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <HTML xmlns = "http://www.w3.org/1999/xhtml" XML: lang = "ZH-CN" lang = "ZH-CN">Data. php
<? Phpecho 'hash: '. $ _ Get ['hash']. Rand (0, 10);?>==========================================================<HTML>
<Head>
<Script language = "JavaScript" type = "text/JavaScript">VaR expectedhash = "";
Function makehistory (newhash ){
Window. Location. Hash = newhash;
Expectedhash = Window. Location. Hash;
Return true;}Function reportoptionvalue (){
VaR myform = Document. make_history;
VaR myselect = myform. change_year;
Return myselect. Options [myselect. selectedindex]. value;
}Function setoptionvalue (value ){
VaR myform = Document. make_history;
VaR myselect = myform. change_year;
Myselect. Options [value-1]. Selected = true;
Return true;
}Function handlehistory (){
If (window. Location. Hash! = Expectedhash ){
Expectedhash = Window. Location. Hash;
VaR newoption = expectedhash. substring (6 );
Setoptionvalue (newoption );
}
Return true;
}Function pollhash (){
Handlehistory ();
Window. setinterval ("handlehistory ()", 1000 );
Return true;
}
</SCRIPT>
</Head>
<Body Language = "JavaScript" onLoad = "Return pollhash ()">
<Form name = make_history>
<Select name = change_year onchange = "Return makehistory (reportoptionvalue ()">
<Option value = "year_1"> Year 1 </option>
<Option value = "year_2"> year 2 </option>
</SELECT>
</Form>
</Body>
</Html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
