js选择下拉联动更具级联性！

之前有过记录，选择下拉联动（引导、JQuery插件之cxselect)区别在这个级联性更强。

超文本标记语言源码：

！DOCTYPE html head meta charset=' utf-8 ' title/title/head script type=' text/JAVAScript ' src=' http :http://apps。bdimg。com/libs/jquery/2。1 .4/jquery。量滴js '/脚本类型=' text/JavaScript ' src=' http : usjs。js '/脚本体div class=' container '表tr TD厂商：/td tdselect id='selF '选项请选择/option/select/td td品牌：/td tdselect id='selT '选项请选择/option/select/td td型号：/td tdselect id='selC '选项请选择/option/select/TD tdinput type=' button ' value='查询id=' button 1 ' class=' BTN '/TD/tr/table/div/body/html JS(usjs。JS)源码：在转载的基础上做了修改，特别是源数据JSON格式。

$(function(){ function Objinit(obj){ return $(obj)).html(“”选项请选择/option ')；} $.getJSON('data.json '，function(JSON){ var arr data=JSON；$.每个(arrData，function(pF，pV){ $('#selF ').追加('选项值=' ' pF ' ' ' PV。n /选项');});$('#selF ').change(function(){ Objinit(' # SelT ')；objInit(' # SelC ')；$.每个(arrData，function(pF，PS){ if($(' # SelF options : select ')).attr('值'==pF){ $ .每个(pS.s，function(pT，pC){ $('#selT ').追加('选项值=' pT ' ' ' Pc。n /选项');});$('#selT ').change(function(){ Objinit(' # SelC ')；$.每个(pS.s，function(pT，Pc){ if($(' # SelT options : select ')).attr('value')==pT){ $ .每个(pC.s，函数(ii，vv){ $('#selC ').追加('选项值=' ii ' ' ' vv。n /选项');}) } }) });} }) });});//getJSON })；JSON(data.json)文件，

[ { 'n': '厂商1 '，' s':[ { 'n': '品牌一，s':[{'n': '型号1-1-1'}，{'n': '型号1-1-2'}] }，{ 'n': '品牌二，s':[{'n': '型号1-2-1'}，{'n': '型号1-2-2'}] } ] }，{ 'n': '厂商2 '，' s':[ { 'n': '品牌一，s':[{'n': '型号2-1-1'}，{'n': '型号2-1-2'}] }，{ 'n': '品牌二，s':[{'n': '型号2-2-1'}，{'n': '型号2-2-2'}] } ] }，{ 'n': '厂商3 '，' s':[ { 'n': '品牌一，s':[{'n': '型号3-1-1'}，{'n': '型号3-1-2'}] }，{ 'n': '品牌二，s':[{'n': '型号3-2-1'}，{'n': '型号3-2-2'}] } ] } ]更多信息，请访问：//www .JB 51。net/article/102040。html文件的后缀

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。