Select標(biāo)簽下拉列表二級(jí)聯(lián)動(dòng)級(jí)聯(lián)實(shí)例代碼
更新時(shí)間：2014年02月07日 14:48:19 作者：
這篇文章主要介紹了Select標(biāo)簽下拉列表二級(jí)聯(lián)動(dòng)級(jí)聯(lián)實(shí)例代碼,需要的朋友可以參考下
首先從服務(wù)器端，綁定下拉列表，二級(jí)下拉的text命名按照一定規(guī)則加上一級(jí)下拉的ID。
var options=new Array();
$(document).ready(function(){
//二級(jí)聯(lián)動(dòng)
$('#ddlPages').children('option').each(function(i){
options[i]='<option value="'+$(this).val()+'">'+$(this).text()+'</option>';
});//將option列表放到數(shù)組里
$('#ddlPages option:gt(0)').remove(); //清楚下拉
$('#ddlSubsystems').bind('change',function(){ //注冊(cè)事件
var systemname=$('#ddlSubsystems option:selected').text();
for(var j=0;j<options.length;j++){
$('#ddlPages').append(options[j]);
} //option列表先初始化
$('#ddlPages option:gt(0)').each(function(i){ //遍歷排除
var textname=$(this).text();
var index=textname.indexOf('-'+systemname);
if(index<0){
$(this).remove();
}else{
$(this).text(textname.substring(0,index));
}
});
$('#ddlPages').val(0); //默認(rèn)選中第一行
});
});
復(fù)制代碼 代碼如下:
var options=new Array();
$(document).ready(function(){
//二級(jí)聯(lián)動(dòng)
$('#ddlPages').children('option').each(function(i){
options[i]='<option value="'+$(this).val()+'">'+$(this).text()+'</option>';
});//將option列表放到數(shù)組里
$('#ddlPages option:gt(0)').remove(); //清楚下拉
$('#ddlSubsystems').bind('change',function(){ //注冊(cè)事件
var systemname=$('#ddlSubsystems option:selected').text();
for(var j=0;j<options.length;j++){
$('#ddlPages').append(options[j]);
} //option列表先初始化
$('#ddlPages option:gt(0)').each(function(i){ //遍歷排除
var textname=$(this).text();
var index=textname.indexOf('-'+systemname);
if(index<0){
$(this).remove();
}else{
$(this).text(textname.substring(0,index));
}
});
$('#ddlPages').val(0); //默認(rèn)選中第一行
});
});
相關(guān)文章
JavaScript中“基本類(lèi)型”之爭(zhēng)小結(jié)
所謂“基本類(lèi)型（primitive types）”的概念ECMAScript（V3，V5）中壓根就沒(méi)有，它只是將類(lèi)型分為6種,感興趣的朋友可以參考下2013-01-01
這篇文章主要為大家詳細(xì)介紹了微信小程序商品詳情頁(yè)底部彈出框，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-11-11
JavaScript實(shí)現(xiàn)復(fù)制功能各瀏覽器支持情況實(shí)測(cè)
這兩天在做Web前端時(shí)，遇到需求通過(guò)js實(shí)現(xiàn)文本復(fù)制的功能，下面與大家分享下各瀏覽器對(duì)復(fù)制功能的支持情況，感興趣的朋友可以參考下哈2013-07-07
Bootstrap組件學(xué)習(xí)之導(dǎo)航、標(biāo)簽、面包屑導(dǎo)航(精品)
這篇文章主要介紹了Bootstrap組件學(xué)習(xí)之導(dǎo)航、標(biāo)簽、面包屑導(dǎo)航(精品)的相關(guān)資料,需要的朋友可以參考下2016-05-05
ES6?的模塊化汲取了?CommonJS?和AMD?的優(yōu)點(diǎn),擁有簡(jiǎn)潔的語(yǔ)法和異步的支持,并且寫(xiě)法也和?CommonJS?非常的相似,下面我們就來(lái)看看二者用法的差異吧2023-09-09
一個(gè)網(wǎng)頁(yè)標(biāo)題title的閃動(dòng)提示效果實(shí)現(xiàn)思路
通過(guò)網(wǎng)頁(yè)title來(lái)提示用戶有新消息這個(gè)功能很常見(jiàn)，下面有個(gè)不錯(cuò)的示例，大家可以參考下2014-03-03
Js 時(shí)間函數(shù)getYear()的使用問(wèn)題探討
不推薦使用getYear()這個(gè)函數(shù)，因?yàn)樵诨鸷酗@示是不正確的，所以推薦使用getFullYear() 函數(shù)，接下來(lái)為大家詳細(xì)介紹下getYear函數(shù)在不同瀏覽下的使用問(wèn)題2013-04-04
這篇文章主要為大家詳細(xì)介紹了js拖拽的原型聲明和用法總結(jié)，感興趣的朋友可以參考一下2016-04-04
JS簡(jiǎn)單實(shí)現(xiàn)數(shù)組去重的方法示例
這篇文章主要介紹了JS簡(jiǎn)單實(shí)現(xiàn)數(shù)組去重的方法,涉及javascript數(shù)組的遍歷、判斷及賦值操作,代碼非常簡(jiǎn)單易懂,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2017-03-03
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)小窗口拖拽效果,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-12-12