Question

我在尝试选择特定选项时显示div。

<select id="post_category_select" onchange="if 
   ($('#post_category_select').val() == '3') {
      $('#post').show();
   } else {
     $('#post').hide();
   }">
 <option value="1">1</option>
 <option value="2">2</option>
 <option value="3">3</option>
</select>
<div id="post">
  Example
</div>

我将这些值从添加帖子页面保存到我的数据库，并且我使用相同的编辑页面结构。

我的问题是，当我在编辑页面上从数据库中提取值时，我必须将选项更改为3以查看div#post，即使该选项为3。

Answer 1

将此代码放入标题中，您就可以了。然后，确保您要显示的div具有“writer”的ID。看起来它目前的ID为“post”

<script>
$(document).ready(function() {
    // First, grab the value of our select box as it is currently.
    var postSelect = $('#post_category_select').val();

    // If our current value is set to 3, we want to show the div.
    if(postSelect == '3') {
        $('#post').show();
    } else {
        // If it's not, hide it.
        $('#post').hide();
    }

    // Do the same thing when the input is changed.
    $('#post_category_select').change(function() {
        if($(this).val() == '3') {
            $('#post').show();
        } else {
            $('#post').hide();
        }
    });
});
</script>

Answer 2

在select输入上为change事件添加一个不引人注目的JavaScript处理程序，并在文档就绪函数中触发change事件。

<select id="post_category_select">
 <option value="1">1</option>
 <option value="2">2</option>
 <option value="3" selected="selected">3</option>
</select>
<div id="post">
  Example
</div>

<script type="text/javascript">
    $(function(){
        $('#post_category_select').change(function() {
            $('#post').toggle($(this).val() == '3');
        });
        $('#post_category_select').trigger('change');
    });
</script>

在特定选项上显示另一个div

2 个答案: