jquery show div选择后形式选择

Question

我想单击选择表单中的一个选项后显示div。 我该怎么做？在我的代码下面，这是行不通的。

感谢

<div class="type-select" style="width:500px;"> 
<select name="rechten" id="rechten"> 
    <option value="MYSET"><?php echo $lang->str("txt_myset"); ?></option> 
     <option value="FULL"><?php echo $lang->str("txt_full"); ?></option> 
     <option value="PAY" id="show_pay"><?php echo $lang->str("txt_pay"); ?></option> 
     <option value="NULL"><?php echo $lang->str("txt_null"); ?></option>     
</select> 
</div> 


<div id="pay_block" style="width:500px;display:none;position:relative;"> 
<?php print($lang->str("txt_price")); ?>: 
<div class="type-text" > 
    <textarea name="prijs" cols="140" id="prijs" style="height:18px"></textarea> 
</div>  
</div> 


<script> 
$("select#show_pay").click(function(){ 
    $("#pay_block").slideToggle("slow"); 
}); 
</script> 

Answer 1

它可能不工作，因为你的选择是与ID show_pay一个select元素。如果我理解正确，当您选择特定的option时，您只想显示此div只有。这里有一种方法 - div仅在所选元素是您想要的元素时显示，在其他情况下，如果当前显示则隐藏。

$("#rechten").change(function(){ 
    if($("#rechten option:selected").attr('id') === 'show_pay'){ 
     $("#pay_block").slideDown("slow"); 
    } 
    else{ 
     $("#pay_block").slideUp("slow"); 
    } 
} 

Answer 2

$(function() { 
    $('select#rechten').change(function() { 
    if ($('#pay_block').css('display')=='none') 
     $("#pay_block").slideToggle("slow"); 
    }); 
}); 

http://jsfiddle.net/pDwCB/

Answer 3

$("select").change(function(){ 
    if($("#show_pay").is(":selected")){ 
     $("#pay_block").slideDown("slow"); 
    } else { $("#pay_block").slideUp("slow"); } 
});