Ajax更改按鈕提交時鏈接的類名稱

Question

我有四個菜單選項卡。在一個選項卡中是提交表單（默認），第二個選項卡包含條目列表，每個條目都有一個稱爲更改狀態的按鈕。當我點擊「更改狀態」時，我使用ajax調用windows.reload來刷新頁面，但該選項卡將返回默認的第一個。現在我的問題是我怎麼能更新menutab類到當前選定的菜單成爲一個活躍的。下面是我的阿賈克斯代碼：

<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

您正在重新加載頁面，所以後面發生的任何JavaScript都將失去其狀態。 DOM修改僅適用於當前頁面會話。一旦它被導航或重新加載，它們就會失去進展。

你認爲沒有重新加載？爲什麼你要重新加載？

，或者

你能做到，也許這些變化的客戶端，並且而不是重新加載，重定向到不同的GET參數相同的頁面？

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

Answer 2

location.reload（）重新加載網站，所以你不能使用jQuery方法。

也許window.location.hash可以幫到你。

添加一個散列並在網站重新加載後解析這個散列來觸發你的類？

Answer 3

嘗試使用location.hash，因爲解釋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>