如何实现select select二级联动效果

<li style="margin-right:-5px">一级类目：
                    <select id="mainCategoryId" name="mainCategoryId" class="length_2" onchange="changeCate()">
                        <option value="">---请选择---</option>
                        #foreach($cell in $categories)
                            <option value="$!{cell.id}"  #if($!cell.id ==  $!query.mainCategoryId) selected #end >$!{cell.name}</option>
                        #end
                    </select>
                </li>
                <li style="margin-right:-5px">二级类目：
                    <select class="categoryId" name="categoryId" class="length_2">
                        <option value="">---请选择---</option>
                    </select>
                </li>

function changeCate(){    
 var  mainCategoryId = 
$("#mainCategoryId").find("option:selected").val();   
 if(mainCategoryId == "") {        
 $(".categoryId").empty().append("520dd156c44cb6a5aae38550b5c48a0b---请选择---4afa15d3069109ac30911f04c56f3338");        
 return false;
    }    
 $.ajax({       
     url:'/tvtao/video/item/category.htm',        
     type:"post",        
     dataType:"json",        
     data: {'_tb_token_' : $("input[name='_tb_token_']").val(), parantId : mainCategoryId},        
     success: function (data) {            
     console.log(data);            
     $(".categoryId").empty().append("520dd156c44cb6a5aae38550b5c48a0b---请选择---4afa15d3069109ac30911f04c56f3338");           
      for(var i = 0, len = data.length; i 78ac66e8ecf169eea75a9dee23087133" + data[i].name + "4afa15d3069109ac30911f04c56f3338"));
            }

        }
    });
}

以上是如何实现select select二级联动效果的详细内容。更多信息请关注PHP中文网其他相关文章！