JavaScript three-level linkage video data sharing

The knowledge points introduced in this video are three-level linkages that are often used in our daily work. For example, when we buy something online and fill in the delivery address, some drop-down boxes will appear, allowing us to select the address. There are also other categories. For example, if you want to buy clothes, you will choose men's, women's and children's clothing. Under men's clothing, there will be suits, sports and leisure, and the like. Therefore, if you learn the content of this video well, it will be very useful for your future work.

Video playback address: http://www.php.cn/course/198.html

The difficulty of this video is The writing of JavaScript core code is a practical application of the basic knowledge of 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==&#39;-1&#39;){
            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);
            }
        }
    }

This video lecturer is given by Ji Wei, a young lecturer from the PHP Chinese website. The lecture is lively and interesting, and he does not waste time on both the keynote and the lecture. Take full consideration of students' feelings. The basic courses are from simple to advanced, and the practical courses are from simple to complex. The purpose of his teaching is to learn what you want to learn while playing. Learning is the same as playing. Representative works: "Learn PHP at Your Fingertips" , etc., you can study and study them.

The above is the detailed content of JavaScript three-level linkage video data sharing. For more information, please follow other related articles on the PHP Chinese website!