js code to simulate select drop-down menu control_javascript skills

Copy code The code is as follows:

 
 
 
 
 
 
   
 
  

          

            

                

select选择

                
                

                    
• jq的select模拟1

                    
• jq的select模拟2

                    
• jq的select模拟3

                

            

            

                

select选择2

                
                

                    
• jq的select模拟11

                    
• jq的select模拟22

                    
• jq的select模拟31

                

            

        

 

   <script><br><br>     window.onload=function(){<br>     var oflink = document.getElementById('sel');<br>     var aDt = oflink.getElementsByTagName('dt');<br>     var aUl = oflink.getElementsByTagName('ul');<br>     var aH3= oflink.getElementsByTagName('h3');<br>     for(var i=0;i<aDt.length;i ){<br>         aDt[i].index = i;<br>         aDt[i].onclick = function(ev){<br>             var ev = ev || window.event;<br>             var This = this;<br>             for(var i=0;i<aUl.length;i ){<br>                 aUl[i].style.display = 'none';<br>             }<br>             aUl[this.index].style.display = 'block';<br>             document.onclick = function(){<br>                 aUl[This.index].style.display = 'none';<br>             };<br>             ev.cancelBubble = true;<br><br>         };<br>     }<br>     for(var i=0;i<aUl.length;i ){<br><br>         aUl[i].index = i;<br><br>         (function(ul){<br><br>             var iLi = ul.getElementsByTagName('li');<br><br>             for(var i=0;i<iLi.length;i ){<br>                 iLi[i].onmouseover = function(){<br>                     this.className = 'hover';<br>                 };<br>                 iLi[i].onmouseout = function(){<br>                     this.className = '';<br>                 };<br>                 iLi[i].onclick = function(ev){<br>                     var ev = ev || window.event;<br>                     aH3[this.parentNode.index].innerHTML = this.innerHTML;<br>                     ev.cancelBubble = true;<br>                     this.parentNode.style.display = 'none';<br>                 };<br>             }<br><br>         })(aUl[i]);<br>     }<br><br> }<br>   </script>