如何显示隐藏的div?

时间:2013-01-06 18:03:07

标签: jquery forms radio-button show-hide hidden

我有无线电盒的jquery,我说如果点击属于这个类并且有这个id的无线电盒,则显示这个隐藏的div。问题是,当您刷新pag时,仍会单击单选框,但隐藏的div不会显示。它仅显示我是否单击其他单选框,然后单击返回到单击的原始单选框。

这是我正在使用的javascript:

$(function(){     
    $('.display').click(function(){
        if ($(this).attr("id") == "rows"){
            $('.section').show();
        } else {
            $('.section').hide();
        }
    });
});

以下是我从这部分javascript中获取的示例,以向您展示一个有效的示例。 Working Example

现在,如果这是一个表单,并且您单击了商品2然后保存了表单并返回到页面,那么隐藏的div将不会显示。只要单击该单选框,我如何才能显示div?

注意:该示例使用jquery 1.5.1,我使用的是最新版本的jquery。

应该注意的是,无线电盒的保存方式无关紧要,保存了无线电盒用户选择,因此在页面刷新时,用户选择的无线电盒仍然被“选中”。然后应该显示隐藏的div - 如何不是。

仅在我选择不同的收音机盒然后返回最初选择的收音机盒时才会显示。请参阅上面的工作示例,了解选择单选框时隐藏div的显示方式。

如果选中了收音机框,我希望始终显示此div。

1 个答案:

答案 0 :(得分:0)

$(function(){     

    // your function
    $('.display').click(function(){
        if ($(this).attr("id") === "rows"){
            $('.section').show();
        } else {
            $('.section').hide();
        }
    });

    // initial check
    if ($('input:radio:checked').attr('id') === "rows") {
        $('.section').show();
    }

});

如果页面上有多个单选按钮,则需要为jQuery选择器添加标识符。您可以使用输入字段的名称,如下所示:

$('input[name=myradiobutton]:radio:checked')