在ajax jquery中重新加载页面后,单击链接显示隐藏的div

时间:2015-09-18 07:43:44

标签: javascript php jquery html ajax

在我的页面中,我有许多隐藏的div。在页面加载时,div被隐藏。单击链接时,将显示特定的div。我需要它,因为页面重新加载后应显示div。

我的代码在这里:

<li><a class="add_new" href="javascript:void(0);" onClick="showdivs()">Add </a></li>
<li><a class="info" href="javascript:void(0);" onClick="showdivs()">info</a></li>

<div id="add_new">hai.....</div>
<div id="info">heloo..</div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<script>
    $(window).load(function() {
        $("#info").hide();
        $("#add_new").hide();
    });

    function showdivs() {
        var divs = $("#info,#add_new");

        //Show chosen div, and hide all others
        $("li a").click(function() {

            $(divs).hide();
            $("#" + $(this).attr("class")).show();

        });
</script>

代码有效,但页面没有刷新。我需要重新加载页面,然后显示隐藏的div。

3 个答案:

答案 0 :(得分:0)

我不知道这是否是您正在寻找的,但我认为您想要重新加载页面,因为div没有显示,问题是,您添加了您的点击处理程序以显示div “的onClick”:

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script>
$(window).load(function () {
    $("#info").hide();
    $("#add_new").hide();
});

function showdivs( element ) {// element is this param
    $("#" + $( element ).attr("class")).show();
}

</script>
<!-- add parameter this-->
<li><a class="add_new" href="javascript:void(0);" onClick="showdivs(this)">Add </a></li>
<li><a class="info" href="javascript:void(0);" onClick="showdivs(this)">info</a></li>

<div id="add_new">hai.....</div>
<div id = "info">heloo..</div>

所以你必须点击两次才能显示div。所以这是我的方法:

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script>
$(window).load(function () {
    $("#info").hide();
    $("#add_new").hide();

    $("li a").click( function () {
        $("#" + $( this ).attr("class")).show();
    });

});

</script>

<li><a class="add_new" href="javascript:void(0);">Add </a></li>
<li><a class="info" href="javascript:void(0);">info</a></li>

<div id="add_new">hai.....</div>
<div id = "info">heloo..</div>

你也可以这样做:

=INDEX(1:1, 1, INT((COLUMNS($A:A)-1)/2)*2+1)

答案 1 :(得分:0)

当您显示div时,请使用document.cookie = "divToShow=" + idOfTheDivToShow;将该类存储在Cookie中。

如果您想刷新页面,请在javascript中使用Location.reload()

然后,使用此功能获取您的divToShow Cookie并显示相关的div:

function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for(var i=0; i<ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1);
        if (c.indexOf(name) == 0) return c.substring(name.length,c.length);
    }
    return ""; 
}

答案 2 :(得分:0)

试试此代码

<body>
<li><a class="add_new" href="javascript:void(0);" onClick="showdivs()">Add </a></li>
<li><a class="info" href="javascript:void(0);" onClick="showdivs()">info</a></li>

<div id="add_new">hai.....</div>
<div id="info">heloo..</div>

<script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>

<script>
    jQuery(window).load(function() {
        jQuery("#info").hide();
        jQuery("#add_new").hide();
    });

    function showdivs() {
        var divs = jQuery("#info,#add_new");

        //Show chosen div, and hide all others
        jQuery("li a").click(function() {

            jQuery(divs).hide();
            jQuery("#" + $(this).attr("class")).show();
        });
    }
</script>
</body>