茄子在线看片免费人成视频,午夜福利精品a在线观看,国产高清自产拍在线观看,久久综合久久狠狠综合

    <s id="ddbnn"></s>
  • <sub id="ddbnn"><ol id="ddbnn"></ol></sub>

  • <legend id="ddbnn"></legend><s id="ddbnn"></s>

    js控制option的隱多級聯(lián)動
    來源:易賢網(wǎng) 閱讀:1299 次 日期:2016-06-17 09:23:02
    溫馨提示:易賢網(wǎng)小編為您整理了“js控制option的隱多級聯(lián)動”,方便廣大網(wǎng)友查閱!

    二級聯(lián)動,簡單的說就是,當下拉列表a1的的值改變時,下一級下拉列表b1也跟著動,但是下拉列表b1的值是與下拉列表a1的值相對應的。比如:a1選中“技術部”的話,b1的所有下拉項都顯示的是與a1相對應的技術部成員,這個過程因為都是在客戶端執(zhí)行的不會在服務器端操作所以是無刷新實現(xiàn)的。

    三級聯(lián)動或多級聯(lián)動,就是利用二級聯(lián)動的思想,第一級改變時,第二級跟著變,第三級跟著第二級變,第四級跟著第三級變。。。。

    二級聯(lián)動,三級聯(lián)動,多級聯(lián)動實踐:

    二級聯(lián)動,當?shù)谝患夁x中一個改變選項,激發(fā)聯(lián)動函數(shù),這個函數(shù)用以改變第二個下拉列表的值,實現(xiàn)過程是,根據(jù)第一級傳過來的值遍歷數(shù)組,找到與第一級相對應的選項,然后加到第二級列表上。

    三級聯(lián)動或多級聯(lián)動,第一級改變時,第二級跟著變,第二級改變時,第三級跟著變。

    二級聯(lián)動下拉列表的實現(xiàn)是通過一個函數(shù)來實現(xiàn)的,如果在實現(xiàn)三級聯(lián)動下拉列表或多級聯(lián)動下拉列表的話,我們是直接復制二級聯(lián)動下拉列表的函數(shù),改一下函數(shù)名及相關參數(shù),這樣是可以解決問題的,但咱們是做程序的,應該讓自己的程序更通用話,盡量適應各種情況,如果這樣一來,平白的又添加了一個函數(shù),并且如果是多級的話您就得重寫這個函數(shù)多次,然而,您也許會想到,多級聯(lián)動下拉列表與二級其實思想是一樣的,那么我們?yōu)槭裁床荒苡靡粋€函數(shù)來實現(xiàn)呢,并且一定是可以實現(xiàn)的,但這樣實現(xiàn)的人很少,為什么呢,一般都覺得沒這個必要,但每次遇到這樣的問題時還是得研究半天,今天我要給大家介紹的是,一個函數(shù)來實現(xiàn)多級聯(lián)動,使用的是類似與遞歸的思想,每一級onchange()時都會調(diào)用一個函數(shù),這個函數(shù)會改變下一級的值并激發(fā)其onchange(),這時下一級的onchange里如果還是調(diào)用這個函數(shù)的話,那么這個函數(shù)還會再次運行,直到最后一級,因為最后一級onchange=所以他不會再激發(fā)下一級,完成所有聯(lián)動。

    數(shù)組數(shù)據(jù)源可以接受兩種:  

    1.[categoryname,parentcategoryname]  即:[當前名稱,父級名稱]  

    2.['categoryname','parentid','nowid']    即:[當前名稱,父級id,當前id]  

    上面說的父級,如果本身就是最上一級,那么父級就寫成0或0  

    調(diào)用方法:  

    網(wǎng)頁各級聯(lián)(聯(lián)動)下拉列表必須含有兩個屬性:id,onchange.  

    最后一個下拉列表onchange=(空,但必須寫上)。  

    函數(shù)調(diào)用方法:changeselect(上一級的值,下一級select控件的id值,下一級select控件要選中的值(即value而非text),數(shù)據(jù)源數(shù)組名,默認顯示字符(如:請選擇...如果不寫的話會用默認值填充)),  

    舉例:  

    第一級<select id=province  onchange=changeselect(this.value,'city','',arrcity3,'請選擇市') ></select>  

    第二級<select id=city onchange=changeselect(this.value,'area','',arrcity3) ></select>  

    第三級<select id=area onchange= ></select>  

    設置網(wǎng)頁加載完后運行一次,可以設置默認值,默認狀態(tài)下第一個參數(shù)是0 

    看代碼:

    <!doctype html public -//w3c//dtd xhtml 1.0 transitional//en >

    <html xmlns=>

    <head>

    <meta http-equiv=content-type content=text/html; charset=gb2312 />

    <title>無標題文檔</title>

    <script language=javascript type=text/javascript>

    //changeselect(上一級的值,下一級select控件的id值,下一級select控件要選中的值(即value而非text),數(shù)據(jù)源數(shù)組名,默認顯示字符(如:請選擇...如果不寫的話會用默認值填充)),第一級的上級值為0

    function changeselect(parentvalue, nextid, nextselectedvalue, arrobj,defaultstr)

    {

    strobj = eval(document.getelementbyid(nextid));

    strobj.length = 0;

    //判斷它是二級數(shù)據(jù)源,還是三級

    if (arrobj.length > 0)

    {

    if (arrobj[0].length == 2)

    {arrnum = 0;}

    else

    {arrnum = 2;}

    }

    //顯示所有列表

    for (i = 0; i < arrobj.length; i++)

    {

    if (i == 0)

    {

    if (defaultstr == undefined ) defaultstr===請選擇==;

    strobj.options[strobj.length] = new option(defaultstr, );

    }

    if (arrobj[i][1] == parentvalue)

    {

    strobj.options[strobj.length] = new option(arrobj[i][0],arrobj[i][arrnum]);

    }

    }

    //選中列表內(nèi)某一項

    for (i = 0; i < strobj.length; i++)

    {

    if (strobj.options[i].value == nextselectedvalue)

    {

    strobj.options[i].selected = true;

    }

    }

    //激發(fā)下一級的onchange事件以實現(xiàn)多級級聯(lián)

    strobj.onchange();

    }

    //公司二維數(shù)組數(shù)據(jù)源

    office = [

    [categoryname,parentcategoryname],

    [業(yè)務部,0],

    [技術部,0],

    [市場部,0],

    [業(yè)務部小柳,業(yè)務部],

    [業(yè)務部小楊,業(yè)務部],

    [業(yè)務部小菜,業(yè)務部],

    [技術部老柳,技術部],

    [技術部老楊,技術部],

    [技術部老菜,技術部],

    [市場部柳先生,市場部],

    [市場部楊先生,市場部],

    [市場部菜鳥,市場部]

    ]

    //省市二維數(shù)組數(shù)據(jù)源

    city2 = [

    [categoryname,parentcategoryname],

    [山西省,0],

    [河北省,0],

    [太原市,山西省],

    [運城市,山西省],

    [石家莊,河北省],

    [廊房,河北省]

    ]

    //省市三維數(shù)組數(shù)據(jù)源

    city3 = [

    [categoryname,parentid,id],

    [北京,0,010],

    [山西,0,0359],

    [朝陽區(qū),010,001],

    [海淀區(qū),010,002],

    [豆各莊,001,101],

    [十里堡,001,102],

    [中關村,002,201],

    [上地,002,202],

    [運城地區(qū),0359,301],

    [太原市,0359,302],

    [永濟市,301,311],

    [小區(qū),302,312]

    ];

    </script>

    </head>

    <body>

    <select id=office1  onchange=changeselect(this.value,'office2','',office,'==人員==') style=width:100px></select>

    <select id=office2 onchange= style=width:100px></select>

    <script language=javascript type=text/javascript>changeselect('0','office1','',office,'==部門==') </script>

    <br />

    <select id=city001  onchange=changeselect(this.value,'city002','',city2) style=width:100px></select>

    <select id=city002 onchange= style=width:100px></select>

    <script language=javascript type=text/javascript>changeselect('0','city001','',city2) </script>

    <br />

    <select id=city3001  onchange=changeselect(this.value,'city3002','',city3) style=width:100px></select>

    <select id=city3002  onchange=changeselect(this.value,'city3003','',city3) style=width:100px></select>

    <select id=city3003 onchange= style=width:100px></select>

    <script language=javascript type=text/javascript>changeselect('0','city3001','0359',city3) </script>

    <br />

    </body>

    </html>

    更多信息請查看腳本欄目
    易賢網(wǎng)手機網(wǎng)站地址:js控制option的隱多級聯(lián)動

    2026國考·省考課程試聽報名

    • 報班類型
    • 姓名
    • 手機號
    • 驗證碼
    關于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
    工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網(wǎng)安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
    聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
    咨詢QQ:1093837350(9:00—18:00)版權(quán)所有:易賢網(wǎng)