如何使用jQuery隐藏/显示'div'?

时间:2015-03-17 03:02:25

标签: javascript php jquery

如何根据用户在下拉框中的选择显示文本框?

<select name="sites" id="select5" required="yes">
  <?php
   for($i=0;$i<=128;$i++){
     echo "<option>".$i."</option>";
   }                               
  ?>
</select>

<div id="YES"> 
 Other: <input class="input-text" type="text" name="name"/>
</div>

如果用户选择1 - 则不显示文本框。 然后,如果用户选择超过2 - > <div id="YES">将显示。

这是我的jQuery:

<script type="text/javascript">
    $(document).ready(function(){
    $('#YES').hide();
    $("#select5").change(function(){
            $('#YES').hide('slow');
            $("#" + this.value).show('slow');
    });
    });
</script>

有什么建议吗?

2 个答案:

答案 0 :(得分:6)

您可以根据选择的值

来调用隐藏/显示
$(document).ready(function () {
    $('#YES').hide();
    $("#select5").change(function () {
        $('#YES')[this.value > 1 ? 'show' : 'hide']('slow');
    });
});

演示:Fiddle

答案 1 :(得分:0)

试试这个

$('#select5').on('change', function (e) {
var optionSelected = $("option:selected", this);
var valueSelected = this.value;
if(valueSelected == 1){
$('#YES').show();
}
else{ $('#YES').hide();}
});