Question

我有一个复选框。选中后，会出现一个段落。当它未经检查时，它会隐藏。它没有问题。问题是：如果我选中复选框，当我按下F5（刷新）按钮时，仍然会选中复选框，但会隐藏段落。我想在刷新页面时出现段落。

这是HTML：

<input type="checkbox" id="something">
<p id="info" style="display:none">Yes ,checkbox is checked now...</p>

这是Jquery：

$(document).ready(function() {

    $("#something").change( function(){
        if( $(this).is(':checked') ) {
            $("#info").show();
        } else {
            $("#info").hide();
        }
    });
});

Answer 1

您应该在加载时检查复选框的状态：

$(document).ready(function() {
    function f() {
       if( $('#something').is(':checked') ) {
            $("#info").show();
        } else {
            $("#info").hide();
        }
    }
    $("#something").change(f);
    f();
});

Answer 2

您只需要触发事件

$(document).ready(function() {

    // this only runs upon the event
    $("#something").change( function(){
        if( $(this).is(':checked') ) {
            $("#info").show();
        } else {
            $("#info").hide();
        }
    });

    // trigger the event
    $("#something").trigger("change");
});

Answer 3

您当前的行为是因为您拥有更改的事件处理程序。因此，当您执行F5并刷新时，即使已经选中，也没有任何变化。

您可以在document.ready

中明确调用此函数

function SetParagraphStatus() {
    if ($(this).is(':checked')) {
        $("#info").show();
    } else {
        $("#info").hide();
    }
}

$(document).ready(function () {

    $("#something").change(SetParagraphStatus);
    // call it anyway for load.
    SetParagraphStatus();
});

Answer 4

只需触发更改事件。

$(document).ready(function() {
    $("#something").change(function(){
        $("#info").toggle(this.checked);
    }).change()
})

Answer 5

$(window).bind("beforeunload", function(){

    $("#something >#info").show();

});

页面刷新时如何运行jquery函数？

5 个答案: