selected选中后显示和隐藏div

html Code复制内容到剪贴板
1、select部分 
 <select name="auditstate" id="auditstate" οnchange="showinfo(this[selectedIndex].value)">  
<option value="">--请选择--</option>  
<option value="2">审核通过</option>  
<option value="3">审核不通过</option>  
</select> 
 2、显示和隐藏内容  
<div id="reason"><label class="control-label" style="color:red;">不通过原因:</label>  
<div class="controls"><textarea id="notPassReason" name="notPassReason" style="width:400px;"></textarea></div>  
</div>  
3、js部分
<script type="text/javascript">  
function showinfo(values){  
if(values==2){  
$("#reason").css("display","none");  
}  
if(values==3){  
$("#reason").css("display","block");  
}  
}  
</script>   
 
 二、jquery实现div的显示与隐藏 
1.html代码  
<div><label>选择显示与隐藏类别</label>  
<div><select id="hideselect" name="type" required="">  
<option value="1">隐藏</option>  
<option value="2">显示</option>  
<option value="3">再次隐藏 </option>  
</select></div>  
</div>  
<div id="hide">  
<div><label>添加内容1</label>  
<div><input type="text" name="content1" class="form-control" /></div>  
</div>  
<div><label>添加内容1</label>  
<div><input type="text" name="content1" class="form-control" /></div>  
</div>  
</div>  
<p>2.jquery代码</p>  
<script language='javascript'>  
    $(function(){  
        $(document).ready(function(){  
            $("#hideselect").change(function(){  
                var hideselect = $(this).val();  
                if(hideselect == 2){  
    $("#hide").show().addClass("show");  
                }else{  
                    $("#hide").hide().removeClass("show");  
                }  
            })  
        })  
    });  
</script>  




提示:可以修改后运行.