Question

我有四个菜单选项卡。在一个选项卡中是提交表单（默认），第二个选项卡包含条目列表，每个条目都有一个名为更改状态的按钮。当我点击“更改状态”时，我使用ajax调用了windows.reload来更新没有刷新的页面，但是选项卡将返回到第一个默认的选项卡。现在我的问题是如何将menutab类更新为当前所选菜单以成为活动菜单。下面是我的ajax代码：

<input type="button" value="change status"> // a button to click to change status

<a class="active">tab1</a> // need to change classname when the button clicked
<a class="nonactive">tab2</a> // need to change classname when the button clicked

<script>
$(document).ready(function() { 
    $(".closeBTN").click(function() {

    var data = $(this).attr('id');
    //alert (data);
    $.ajax( {
        type: "POST",
        url: "../deals_status_update.php",
        data: { 'id': data }
    }).done(function(msg) {
        $("#notification").html(msg);           
        window.setTimeout(function(){
            location.reload()

            $('#itrade .active').removeClass().addClass('nonactive');
            $('#iopendeals .nonactive').removeClass().addClass('active');
        },100)          
    });
});
});        
</script>

Answer 1

location.reload（）重新加载网站，所以你不能在那之后使用jQuery方法。

也许window.location.hash可以帮到你。

在网站重新加载后添加哈希并解析此哈希以触发您的类？

Answer 2

尝试使用location.hash，cuz，因为解释了location.reload（）实际上会刷新页面，我仍然不明白为什么你需要刷新页面来更新数据！

<input type="button" value="change status"> // a button to click to change status

<a class="active">tab1</a> // need to change classname when the button clicked
<a class="nonactive">tab2</a> // need to change classname when the button clicked

<script>
$(document).ready(function() { 
    $(".closeBTN").click(function() {    
        var data = $(this).attr('id');

        $.ajax( {
            type: "POST",
            url: "../deals_status_update.php",
            data: { 'id': data }
        }).done(function(msg) {
            $("#notification").html(msg);           
            window.setTimeout(function(){
                location.hash = 'iopendeals';
                location.reload();
            },100)          
        });
    });

    if(location.hash != '') {
        $('.active').removeClass().addClass('nonactive');
        $(location.hash + ' .nonactive').removeClass().addClass('active');
    }
});        
</script>

Answer 3

您正在重新加载页面，因此稍后发生的任何JavaScript都将失去其状态。 DOM修改仅适用于当前页面会话。一旦它被导航或重新加载，它们就会失去进展。

你考虑过没有重装吗？你为什么要重装？

或，

您是否可以在客户端进行这些更改，而不是重新加载，重定向到具有不同GET参数的同一页面？

<li class="menuitem<?=$_GET['page'] == 'homepage' ? ' active' : ''?>">
    Homepage
</li>

Ajax更改按钮提交时链接的类名

3 个答案: