This plug-in was introduced in the previous JQuery template plug-in-jquery. tmpl. Sometimes we need to use dynamic ajax to load templates or data, and load different templates based on url parameters or other information. The data is in the previous JQuery template plug-in-jquery. this plug-in is introduced in tmpl. Sometimes we need to use dynamic ajax to load templates or data, and load different templates and Data Based on url parameters or other information. I have this requirement in a certain project, so I specially wrote jquery tool functions and added local data and ajax data loading templates and data methods.
Parameter description:
Tmpl: function (template, data, fun)
1: template:
1): url: the url for ajax loading. ajax is loaded only when remote = true.
2): data: load parameters for ajax
3) templateSelector: Specifies a local template selector. It is used only when remote is set to false.
4) remote: true indicates ajax, and false indicates local data,
5) cache: Indicates whether to cache the template.
2: data:
1): url: the url for ajax loading. ajax is loaded only when remote = true.
2): data: load parameters for ajax
3) templateData: local data, used only when remote = false
4) remote: true indicates ajax, and false indicates local data,
5) cache: Indicates whether to cache the template.
3: fun is the callback function:
Fun (jquery. tmpl object, template script, data );
The Code is as follows:
The Code is as follows:
; (Function ($ ){
$. Extend ({
Tmpl_Data: function (te, data, fun, templatecache ){
Data = jQuery. extend ({data: "", url: "", templateData :{}, remote: true, cache: true}, data );
If (! Data. remote ){
Fun (te. tmpl (data. templateData), te, data. templateData );
If (! Templatecache ){
Te. remove ();
}
Return;
}
Var da = te. data ("objdata ");
If (data. cache & da! = Null & da! = Undefined ){
Fun (te. tmpl (da), te, da );
If (! Templatecache ){
Te. remove ();
}
Return;
}
$. Ajax ({
Type: "GET ",
Data: data. data,
Url: data. url,
DataType: "json ",
Cache: false,
Context: {template: te, data: data },
Success: function (tmpldata ){
Fun (this. template. tmpl (tmpldata), this. template, tmpldata );
If (data. cache ){
This. template. data ("objdata", tmpldata );
}
If (! Templatecache ){
This. template. remove ();
}
},
Error: function (e ){
Throw "get data error (" + this. data. url + "? "+ This. data. data +"): "+ e;
}
});
},
JquerySelecotrCharChange: function (str ){
Return str. replace (".", "\."). replace ("#","\\#");
},
Tmpl: function (template, data, fun ){
Template = jQuery. extend ({data: "", url: "", templateSelector: "", remote: true, cache: true}, template );
If (! Template. remote ){
$. Tmpl_Data ($ (template. templateSelector), data, fun, true );
Return;
}
Var te = null;
Try {
Te = $ ("script: [url = '" + $. JquerySelecotrCharChange (template. url + "? "+ Template. data) +" '] ")
}
Catch (e ){
}
If (template. cache & te! = Null & te. length> 0 ){
$. Tmpl_Data (te, data, fun, template. cache );
Return;
}
$. Ajax ({
Type: "GET ",
Data: template. data,
Url: template. url,
DataType: "html ",
Cache: false,
Context: {template: template, data: data },
Error: function (e ){
Throw "get template error (" + this. template. url + "? "+ This. template. data +"): "+ e;
},
Success: function (tmpltemplate ){
Var te = $ ('