javascript三级联动视频资料分享
程序员文章站
2022-03-30 20:36:59
...
本视频介绍的知识点,是我们日常工作中经常能用到的三级联动。比如我们在网上买东西,填写收货地址时,有的会出现下拉框,让我们去进行选择地址。还有一些别的分类,比如你想买衣服,就会选择男装女装童装,男装下面又会有西装,运动休闲等等类似的。所以,学好本视频内容,将会对以后工作非常有用。
视频播放地址:http://www.php.cn/course/198.html
本视频难点在于JavaScript核心代码的编写,这是对JavaScript基础掌握的一次实际运用:
var oproc = document.getElementById("proc"); var ocity = document.getElementById("city"); var odist = document.getElementById("dist"); window.onload = function(){ for(var i =0;i<oProc.length;i++){ //创建元素节点 var oOpt = document.createElement("option"); //创建文本节点 var oTxt = document.createTextNode(oProc[i]); oOpt.appendChild(oTxt); oproc.appendChild(oOpt); } }; function showCity(){ if(oproc.value=="-1"){ ocity.options.length = 1; odist.options.length = 1; }else{ ocity.options.length = 1; odist.options.length = 1; var num = oproc.options.selectedIndex; //console.log(num); 测试是否成功 for(var i =0;i<oCity[num-1].length;i++){ var oOpt = document.createElement("option"); var oTxt = document.createTextNode(oCity[num-1][i]); oOpt.appendChild(oTxt); ocity.appendChild(oOpt); } } } function showDist(){ if(ocity.value=='-1'){ odist.options.length = 1 }else{ odist.options.length = 1; var numPro = oproc.options.selectedIndex; var numCity = ocity.options.selectedIndex; for(var i=0;i<oDist[numPro-1][numCity-1].length;i++){ var oOpt = document.createElement("option"); var oTxt = document.createTextNode(oDist[numPro-1][numCity-1][i]); oOpt.appendChild(oTxt); odist.appendChild(oOpt); } } }
本视频讲师为PHP中文网的年轻讲师季伟主讲,讲课生动有趣,连敲带讲两不耽误,充分考虑到学生的感受。基础课程由浅入深,实战课程由简到繁。他的授课宗旨就是,在玩的过程中,学会你想学的,学习就和玩是一样的。代表作品:《弹指间学会PHP》等,大家可以去学习研究。
以上就是javascript三级联动视频资料分享的详细内容,更多请关注其它相关文章!
推荐阅读
-
原生js实现省市区三级联动代码分享
-
百度网盘app视频怎么分享给好友? 百度网盘资料分享的教程
-
JavaScript实现三级联动效果
-
分享个最新Python入门到实战视频资料,讲的非常生动详细
-
分享个最新Python入门到实战flask+小程序视频资料,讲的非常生动详细
-
.net和javascript 结合 ,生成三级联动无刷新下拉菜单【修改版】 .netJavaScript
-
.net和javascript 结合 ,生成三级联动无刷新下拉菜单【修改版】 .netJavaScript
-
原生javascript AJAX 三级联动的实现代码
-
Java相关资料分享(视频+电子书籍)
-
原生javascript AJAX 三级联动