Home > Web Front-end > JS Tutorial > body text

Multi-level linkage code based on JQUERY_jquery

WBOY
Release: 2016-05-16 17:56:50
Original
1042 people have browsed it

jquery.select.more.js

Copy code The code is as follows:

(function($){
$.fn.doselectmore = function(settings) {
var dfop ={
namekey: "name",
pnamekey: "name",
idkey: "id",
selectname:"sel",
method: "POST",
datatype: "json",
param:{},
pval:null,
chckval:null,
chckvalarry:null,
pname:false,
nname:false,
vl:0,
url: false,
data: false
};
$.extend(dfop, settings);
// alert(eobj(dfop));
var me = $(this);
if(!dfop.nname){
dfop.nname = (dfop.selectname (dfop.vl 1));
}
if((!dfop.pname)&&dfop.vl>0){
dfop.pname = dfop.selectname (dfop.vl-1);
}
if(!dfop.data){
if (dfop.url) {
var param = {};
$.ajax({
type: dfop.method,
url: dfop.url,
data: dfop.param,
dataType: dfop.datatype,
success: function(data){
dfop.data=data;
selectmorebuilder(me,dfop);
},
error:(function(request,status,err){
var errText = request.responseText;
var ErrMessage = "页面出现" request.status "错误信息, ";
ErrMessage = "错误内容为:" request.statusText "n" errText.substring(errText.indexOf("
") 5,errText.indexOf("
"));
alert(ErrMessage);
})
});
}
}else{
selectmorebuilder(me,dfop);
}
function selectmorebuilder(thisme,df) {
if(df.chckval!=null&&df.chckvalarry==null){
var pid=df.chckval;
var k=1;
df.chckvalarry = new Array();
df.chckvalarry.push(pid);
while(k>0){
k=0;
$.each(df.data, function(i, item){
if(item[df.idkey]==pid&&item[df.pnamekey]!=df.pval){
pid=item[df.pnamekey];
df.chckvalarry.unshift(pid);
k ;
}
});
}
}
// alert(eobj(df.chckvalarry));
var select = $("");
select.attr({
name:df.selectname dfop.vl,
id:df.selectname dfop.vl,
nname:df.nname,
pname:df.pname,
vl:df.vl
});
var sdiv = null;
if (dfop.vl == 0) {
sdiv = $("
");
thisme.after(sdiv).remove();
sdiv.append("");
sdiv.append(select);
sdiv.get(0).t=df;
}else{
thisme.removeselectmore();
sdiv = $("input[name=" df.selectname "]").parent();
sdiv.append(select);
}
select.empty();
var counti = 0;
$.each(df.data, function(i, item){
if(item[df.pnamekey]==df.pval){
select.append("");
counti ;
}
});
if (counti == 0) {
select.remove();
}
else {
select.change(function(){
var nselect = $("#" $(this).attr("nname"));
if (nselect.length == 0) {
nselect = $("");
sdiv.append(nselect);
}
nselect.doselectmore({
namekey: df.namekey,
pnamekey: df.pnamekey,
idkey: df.idkey,
selectname: df.selectname,
param: df.param,
pval: $(this).val(),
vl: df.vl 1,
chckvalarry:sdiv.get(0).t.chckvalarry,
data: df.data
});
});
if(df.chckvalarry!=null){
if(df.chckvalarry.length>=df.vl)
select.val(df.chckvalarry[df.vl]);
}
if(df.vl==1&&df.chckvalarry!=null&&df.chckvalarry[1]!=select.val()){
var ddf = sdiv.get(0).t;
ddf.chckvalarry=null;
ddf.chckval=null;
sdiv.get(0).t=ddf;
}
select.change();
$("input[type=hidden][name=" df.selectname "]").val($("input[type=hidden][name=" df.selectname "]").getselectmoreval());
}
}
};
$.fn.getselectmoreval = function(){
var me = $(this);
if(me.size()==0) return;
var sdiv = me.parent();
if(sdiv.size()==0) return;
var df = sdiv.get(0).t;
var nselect = $("#" df.selectname df.vl);
var v = null;
while(nselect.size()>0){
v = nselect.val();
nselect = $("#" nselect.attr("nname"));
}
return v;
};
$.fn.setselectmoreval = function(idv){
var me = $(this);
if(me.size()==0) return;
var sdiv = me.parent();
if(sdiv.size()==0) return;
var df = sdiv.get(0).t;
df.chckval=idv;
if(idv!=null){
var pid=df.chckval;
var k=1;
df.chckvalarry = new Array();
df.chckvalarry.push(pid);
while(k>0){
k=0;
$.each(df.data, function(i, item){
if(item[df.idkey]==pid&&item[df.pnamekey]!=df.pval){
pid=item[df.pnamekey];
df.chckvalarry.unshift(pid);
k ;
}
});
}
}
sdiv.get(0).t=df;
var nselect = $("#" df.selectname df.vl);
nselect.val(df.chckvalarry[0]);
nselect.change();
};
$.fn.removeselectmore = function(){
if($(this).attr("nname")!=null){
$("#" $(this).attr("nname")).removeselectmore();
}
$(this).remove();
};
})(jQuery);

help.html
复制代码 代码如下:












Insert title here


方法名:doselectmore

用途:实例化一个对象为多选框

例子:html
 <br><!--head--> <br><script src="jquery.select.more.js" type="text/javascript"/></script> <br><!--body--> <br><input type="text" name="illegbasinfo"> <br>

js:
 <br>/**<br>The following ※ is required, ★ is optional, ? is not required<br>※namekey: data type display name, <br>※pnamekey: data superior primary key name, <br>※idkey: data primary key Name, <br>※selectname: selection box name, <br>※pval: first level superior node value, <br>?chckval: default selection, <br>★url: false, <br>?param: url usage When passing in parameters, <br>★data: false <br>**/ <br>$("input[name=illegbasinfo]").doselectmore({ <br>url:'../../../abc/dic/illbasinfo/loadall.do', <br>pval:0, <br>namekey: "illegbasinfo", <br>pnamekey: "parillegbasid", <br>idkey: "illegbasinfoid", <br>selectname:"illegbasinfo" <br>}); <br>

方法名:doselectmore

用途:得到选中对象值

例子:js:
 <br>$("input[name=test1]").click(function(){ <br>alert($("input[name=illegbasinfo]").getselectmoreval()); <br>}); <br>

方法名:setselectmoreval(val)

用途:为多选框设置值

例子:js:
 <br>$("input[name=test2]").click(function(){ <br>$("input[name=illegbasinfo]").setselectmoreval(347); <br>}); <br>



Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template