Jquery.history.js plug-ins that need to be used
On the shoulders of giants, the following forward backward work is done based on Plug-ins!
Do a few part-time, God help people finish the page when the way to do an AJAX request. Discovery Browser Refresh, back, forward button invalid. So Google a bit. Some solutions have been found. One of the jquery.hashchange.js plug-ins sometimes fails, sometimes causing the page to request multiple times.
Change another plug-in test, perfect to meet my requirements.
The general idea is to add parameters to the URL and all work is done based on this parameter.
Copy Code code as follows:
Intercepts the string required for the first occurrence in the passed-in string. The content between Fieldname+tag and Endtag
function GetQueryString (Url,fieldname,tag,endtag) {
var urlstring = Url;//document.location.href;
if (urlstring!= null) {
var typequ = Fieldname+tag;
var urlend = Urlstring.indexof (typequ);
if (urlend!=-1) {
var paramsurl = urlstring.substring (urlend+typequ.length);
var isend = Paramsurl.indexof (Endtag);
if (isend!=-1) {return paramsurl.substring (0, isend);}
Else{return Paramsurl;}
}
else {return null;}
}
Else{return null;}
}
Set the default page
function Setdefaultpage () {
$ ("#contul ul"). html ("");
$ ("#contul"). Hide ();
$ ("#cont"). Show ();
$ ("#top span"). FIND ("a"). Removeclass ("active");
$ ("#top span:eq (0)"). Find ("a"). AddClass ("active");
}
Detecting final characters
function Checkcode (getparme) {
if (getparme!=null) {
Getparme=getparme.touppercase ();
var codenum=getparme.charcodeat (0)
}
if (codenum>=65&&codenum<=91) {
$ ("#top span"). FIND ("a"). Removeclass ("active");
Alert ((codeNum-64));
$ ("#top Span:eq (" + (codeNum-64) + ")"). Find ("a"). AddClass ("active");
$ ("#cont"). HTML ("");
$ ("#cont"). Hide ();
$ ("#contul"). Find ("UL"). html ("");
Runajaxgetcode (Getparme);
}else{
Setdefaultpage ();
}
}
Performing AJAX operations
function Runajaxgetcode (getparme) {
$ ("#cont"). Fadeout (' Fast ', function () {
$.ajax ({
Cache:false,
Type: ' Get ',
URL: ' Sxml/searchbyword ' +getparme+ '. xml ',
Beforesend:function (XMLHttpRequest) {
$ (' <div class= quick-alert ' > Data loading, please </div> ' later)
. InsertBefore ($ ("#cont"))
. FadeIn (' slow ');
},
Success:function (data,textstatus) {
$ ("#contul"). Show (). FIND ("UL"). html ("");
$ (". Quick-alert"). Fadeout (' Slow ', function () {
$ (this). Remove ();
$ ("item", data). Each (function (i, Domele) {
$ ("#contul ul"). Append ("<li><a href= '" +$ (Domele). Children ("link"). Text () + "' >" +getparme+ ": +$ (Domele) . Children ("title"). Text () + "</a></li>");
if (($ (this). Index ()-6)%6==0) {
$ ("#contul ul"). Append ("<div class= ' Clear ' ></div>");
}
});
});
},
Error:function () {
Alert ("Sorry, data acquisition failed, please F5 refresh the page to try again \ If the problem persists please contact the webmaster to resolve it.") ");
}
});
// });
}
Get parameters
function Getparmeter () {
Getparme=getquerystring (Urlparem, ' #javascript =tagcode ("', ', ', ') ');
Checkcode (Getparme);
}
Getparmeter ();
Click Trigger
$ ("#top span:gt (0)"). Click (function () {
$ (". Quick-alert"). Remove ();
});
Class
$.history.init (function (URL) {
Load (url = ""?) 1 ": URL);
if (url.length>0) {
Getparme=getquerystring (URL, ' Javascript=tagcode ("', ', ', ') ');
if (getparme!=null) {
Getparme=getparme.touppercase ();
Checkcode (Getparme);
}
}
else{
Setdefaultpage ();
}
});
Other actions on the page
var getparme;
function Gethash () {
var curhash = Location.hash;
alert (Curhash);
//}
var Urlparem;
Urlparem=document.location.href;
var tophtml;
var tophtmllink= "";
var $_objtop;
$_objtop=$ ("#top")
Tophtml=$_objtop.html ();
for (var i=65;i <91;i++)
{
tophtmllink+= "<span><a href= ' #javascript =tagcode (\" "+ (String.fromCharCode (i+32)) +" \ ") ' > ' + String.fromCharCode (i) + "</a></span>";
}
$_objtop.html (Tophtml+tophtmllink);
Jquery.history.js Plugin Demos
Some demos are available and included in the repository.
And this site itself are built on the plugin:
Copy Code code as follows:
(function ($) {
var origcontent = "";
function Loadcontent (hash) {
if (hash!= "") {
if (origcontent = = "") {
Origcontent = $ (' #content '). HT ML ();
}
$ (' #content '). Load (hash + ". html",
function () {prettyprint ();});
} else if (origcontent!= "") {
$ (' #content '). HTML (origcontent);
}
$ (document). Ready (function () {
$.history.init (loadcontent);
$ (' #navigation a '). Click (function (e) {
var url = $ (this). attr (' href ');
URL = url.replace (/^.*#/, ' ");
$.history.load (URL);
return false;
});
});
}) (JQuery);