ホームページ > ウェブフロントエンド > jsチュートリアル > JQUERY_jquery に基づくマルチレベルのリンケージ コード

JQUERY_jquery に基づくマルチレベルのリンケージ コード

WBOY
リリース: 2016-05-16 17:56:50
オリジナル
1058 人が閲覧しました

jquery.select.more.js

コードをコピー コードは次のとおりです:

(function($){
$.fn.doselectmore = function(settings) {
var dfop ={
namekey: "名前",
pnamekey: "名前" 、
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);
var me = $(this); ){
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);
})
});
selectmorebuilder(me,dfop)
}
function selectmorebuilder(thisme) ,df) {
if(df.chckval!=null&df.chckvalarry==null){
var pid=df.chckval;
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 ;
}
});
}
}
// アラート(eobj(df.chckvalarry)); ");
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);
}
};
}
}
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
复制代码代码如下:



<頭>








ここにタイトルを挿入


方法名:doselectmore

用途:实例化一例は多选框

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

js:
 <br>/**<br>以下の※は必須、★は任意、?は不要<br>※namekey: データ型表示名、<br>※pnamekey: データ上位主キー名、<br>※idkey: データ主キー名, <br>※selectname: 選択ボックス名、<br>※pval: 第 1 レベルの上位ノードの値、<br>?chckval: デフォルトの選択、<br>★url: false、<br>?param: 渡すときの URL の使用法パラメータ内、<br>★データ: 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>



関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート