• (实用篇)jQuery二级联动代码


    jquery二级联动城市代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
    <title>jQuery 二级联动</title> 
    <script type="text/javascript" src="jquery-1.5.2.min.js"></script>
    <script type="text/javascript"> 
    
    var currentShowCity=0;
    
    $(document).ready(function(){
       $("#province").change(function(){
           $("#province option").each(function(i,o){
               if($(this).attr("selected"))
               {
             
                   $(".city").hide();
                   $(".city").eq(i).show();
                   currentShowCity=i;
               }
           });
       });
       $("#province").change();
    });
    
    function getSelectValue(){
    
        
        alert("1级="+$("#province").val());
         
        $(".city").each(function(i,o){
                       
             if(i == currentShowCity){
                alert("2级="+$(".city").eq(i).val());
             }
            
       });
    
    }
    
    
    </script> 
    </head> 
     
    <body> 
     
       <select id="province"> 
              <option>----请选择省份----</option> 
           <option>北京</option> 
           <option>上海</option> 
           <option>江苏</option> 
       </select> 
       <select class="city"> 
               <option>----请选择城市----</option> 
       </select> 
       <select class="city"> 
           <option>东城</option> 
           <option>西城</option> 
           <option>崇文</option> 
           <option>宣武</option> 
           <option>朝阳</option> 
       </select>  
       <select class="city"> 
           <option>黄浦</option> 
           <option>卢湾</option> 
           <option>徐汇</option> 
           <option>长宁</option> 
           <option>静安</option> 
       </select> 
       <select class="city"> 
           <option>南京</option> 
           <option>镇江</option> 
           <option>苏州</option> 
           <option>南通</option> 
           <option>扬州</option> 
       </select> 
    
    <INPUT TYPE="button" VALUE="点我" ONCLICK="getSelectValue();">
    
    </script>
    </body> 
    </html> 

    以下是实例界面

  • 相关阅读:
    JavaScript 正则表达式
    android源代码提示文本框还能输入多少个字符
    js实现鼠标点击input框后里面的内容就消失代码
    使用prompt输入一句英文句子和排序方式(升/降),将所有单词按排序方式排序后在网页上输出
    Javascript输出表格
    flutter 按键监听
    3.声明
    2.基础类型
    1.安装TypeScrpit
    苹果app证书
  • 原文地址:https://www.cnblogs.com/zhangmiaomiao/p/6013539.html
Copyright © 2020-2023  润新知