簡介

成都創(chuàng)新互聯(lián)堅持“要么做到，要么別承諾”的工作理念，服務領域包括：成都做網(wǎng)站、網(wǎng)站設計、企業(yè)官網(wǎng)、英文網(wǎng)站、手機端網(wǎng)站、網(wǎng)站推廣等服務，滿足客戶于互聯(lián)網(wǎng)時代的樂至網(wǎng)站設計、移動媒體設計的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡建設合作伙伴！

layui，是一款采用自身模塊規(guī)范編寫的前端 UI 框架，遵循原生 HTML/CSS/JS 的書寫與組織形式，門檻極低，拿來即用。其外在極簡，卻又不失飽滿的內在，體積輕盈，組件豐盈，從核心代碼到 API 的每一處細節(jié)都經(jīng)過精心雕琢，非常適合界面的快速開發(fā)。

要實現(xiàn)聯(lián)動效果注意兩點：

第一要可以監(jiān)聽到select的change事件；

第二異步加載的內容，需要重新渲染后才可以 正常使用。

Html結構：

    

        

            選擇地區(qū)
            

                
                    請選擇省
                
            
            

                
                    請選擇市
                
            
            

                
                    請選擇區(qū)/縣
                
            
        
        

            選擇地區(qū)
            

                
                    請選擇鄉(xiāng)鎮(zhèn)/街道
                
            
            
                
                    
                
            
        
    

js：

總結：

1、select的chage監(jiān)聽事件使用

form.on('select(myselect)', function(data){}）  其中myselect是select的 lay-filter屬性值

2、數(shù)據(jù)異步加載到select的option中之后，點擊該select會發(fā)現(xiàn)layui的選中效果不起作用，需要使用form.render('select');重新渲染一次，就可以正常使用。

以上就是基于layui實現(xiàn)select區(qū)域聯(lián)動的詳細內容，更多請關注創(chuàng)新互聯(lián)其它相關文章！