2014-11-21 87 views
0

我有4個div的一個網頁,我使用基於所使用狀突片沒有按鈕點擊jQuery的隱藏/顯示...使用Javascript/jQuery的會話處理或會話狀態

對於大多數的行動沒有RUNAT服務器所以標籤工作正常...

在有服務器運行的情況下,選項卡默認回到原來的狀態回發...我怎麼能保持當前選項卡使用客戶端會話處理選擇並使用Jquery或Javascript加載? (這些div不是runat服務器,所以他們我不能/不想改變它以便在帖子的服務器端設置可見性)

我想知道我可以添加到每個點擊的代碼行函數將設置唯一的會話/本地變量。的代碼的一條線,我可以添加到要顯示隱藏設置爲當前選擇相應的選項卡的document.ready功能....如果讓任何意義......

 $(document).ready(function() { 

     $("#btnTabOperator").click(function() { 
      //Sets the appropriate div to show...hides all the rest 
      $("#OperatorInfo").show(); 
      $("#OperatorProGrowth").hide(); 
      $("#OperatorCertExams").hide(); 
      $("#OperatorScanned").hide(); 
      //sets the selected button to gold, and the unselected to whitesmoke color 
      $("#btnTabOperator").css("background-color","goldenrod"); 
      $("#btnTabProGrowth").css("background-color", "whitesmoke"); 
      $("#btnTabCertAndExams").css("background-color", "whitesmoke"); 
      $("#btnTabScannedFiles").css("background-color", "whitesmoke"); 

     }); 
     $("#btnTabProGrowth").click(function() { 
      $("#OperatorInfo").hide(); 
      $("#OperatorProGrowth").show(); 
      $("#OperatorCertExams").hide(); 
      $("#OperatorScanned").hide(); 

      $("#btnTabOperator").css("background-color", "whitesmoke"); 
      $("#btnTabProGrowth").css("background-color", "goldenrod"); 
      $("#btnTabCertAndExams").css("background-color", "whitesmoke"); 
      $("#btnTabScannedFiles").css("background-color", "whitesmoke"); 

     }); 
     $("#btnTabCertAndExams").click(function() { 
      $("#OperatorInfo").hide(); 
      $("#OperatorProGrowth").hide(); 
      $("#OperatorCertExams").show(); 
      $("#OperatorScanned").hide(); 

      $("#btnTabOperator").css("background-color", "whitesmoke"); 
      $("#btnTabProGrowth").css("background-color", "whitesmoke"); 
      $("#btnTabCertAndExams").css("background-color", "goldenrod"); 
      $("#btnTabScannedFiles").css("background-color", "whitesmoke"); 

     }); 
     $("#btnTabScannedFiles").click(function() { 
      $("#OperatorInfo").hide(); 
      $("#OperatorProGrowth").hide(); 
      $("#OperatorCertExams").hide(); 
      $("#OperatorScanned").show(); 

      $("#btnTabOperator").css("background-color", "whitesmoke"); 
      $("#btnTabProGrowth").css("background-color", "whitesmoke"); 
      $("#btnTabCertAndExams").css("background-color", "whitesmoke"); 
      $("#btnTabScannedFiles").css("background-color", "goldenrod"); 

     }); 
    }); 
</script> 

回答

0

一個簡單的解決方案正在使用Cookie來存儲和檢索標籤的狀態,而無需往返服務器。
UPDATE:
例如,您可以在每個上述區塊注入這條線

$.cookie("activeTab", tabID); 

,並在頁面加載:

var tab_id_= $.cookie("activeTab"); 
     $("#"+tab_id_).show(); 
+0

它在我拋出一個錯誤說它不承認$ .cookie ..所以我想通過放入一個'輸入'控件並隱藏它來解決它。我基於標籤點擊設置其值,並在每次頁面加載時檢索值,並根據該值隱藏/顯示合適的div。 – user2784648 2014-11-21 19:14:19

+1

忘了提及它是一個插件https://github.com/carhartl/jquery-cookie – elsadek 2014-11-21 20:17:48