確定在前一頁點擊什麼

Question

我在一個頁面（div A和​​div B）中有兩個div，默認情況下Div A設置爲顯示塊，Div B設置爲display none。要讓用戶登陸這個特定頁面，他必須點擊對話框中的鏈接。就像這樣：

<div id"dialog-box"> 

    <a href="/newpage.html" class="firstlink"> First Link </a> 

    <a href="/newpage.html" class="secondlink"> Second Link </a> 

</div> 

<div class="newpage"> 

    <div class="divA" style="display:block"> 

    </div> 

    <div class="divB" style="display:none"> 

    </div> 

</div> 

我想要實現的是這樣的：

$(".firstlink").click(function(){ 
    $(".divA").css("display","none"); 
    $(".divB").css("display","block"); 
}); 

$(".secondlink").click(function(){ 
    $(".divA").css("display","block"); 
    $(".divB").css("display","none"); 
}); 

但上面會當然不是因爲耍大牌工作，DIVB是在不同的網頁...，我不想爲這個小任務使用cookies。

Answer 1

我想通過在<a> HREF屬性的查詢字符串所需要的數據。所以我想改變HTML是：

<a href="/newpage.html?link=firstlink" class="firstlink"> First Link </a> 

<a href="/newpage.html?link=secondlink" class="secondlink"> Second Link </a> 

然後，在你newpage.html，我有這樣的代碼：

(function() { 
    "use strict"; 

    /* Parse querystring */ 
    var displayMap = { 
      firstlink: ".divA", 
      secondlink: ".divB" 
     }, 
     qs, pairs, split, i, pair, 
     queryString = {}; 

    qs = location.search; 
    if (qs) { 
     pairs = qs.split("&"); 
     for (i = 0; i < pairs.length; i++) { 
      pair = pairs[i]; 
      split = pair.split("="); 
      queryString[decodeURIComponent(split[0])] = decodeURIComponent(split[1]); 
     } 
    } 
    /* End Parse querystring */ 

    window.onload = function() { 
     var linkPassed, link; 
     linkPassed = queryString["link"]; 
     if (linkPassed) { 
      for (link in displayMap) { 
       if (link === linkPassed) { 
        $(displayMap[link]).hide(); 
       } else { 
        $(displayMap[link]).show(); 
       } 
      } 
     } 
    }; 
}()); 

它看起來在URL中?後，通過將其分解"&"（並在成對上循環），然後按"="。如果密鑰爲"link"，則會繼續查看displayMap以查看該網址中的值轉換爲該頁面上的值，並適當地顯示/隱藏。

我確定有一個更優雅的方式來處理這個問題，但我只是試圖解釋這個方法。

Answer 2

如果您想從上一頁獲取詳細信息，您可以QueryString。

首先鏈接URL會"page1.html?clickedLink=page1Link1"和第二鏈接的URL將是「page1.html?clickedLink=page1Link2"。

現在您的目的地頁面上，你可以檢查QueryString驗證其兩個鏈接把你帶到這個頁面。

Answer 3

使用這

<a href="/newpage.html?b=firstlink" class="firstlink"> First Link </a> 

    <a href="/newpage.html?b=secondlink" class="secondlink"> Second Link </a> 

和recive它的另一個頁面

<?php $link=$_REQUEST['b']; ?> 

，並使用此

<?php if($link=='firstlink'){ ?> 
$(".firstlink").click(function(){ 
    $(".divA").css("display","none"); 
    $(".divB").css("display","block"); 
}); 
<?php 
} 
if($link=='secondlink'){ 
?> 
$(".secondlink").click(function(){ 
    $(".divA").css("display","block"); 
    $(".divB").css("display","none"); 
}); 
<?php 
} 
?> 

Answer 4

您可以在第二頁的鏈接中包含請求參數。在第二頁上，您將使用JavaScript來獲取參數的值，該值將對應於哪個鏈接被點擊。

改變你的鏈接到這樣的東西。

<a href="/newpage.html?link=1" class="firstlink"> First Link </a> 
<a href="/newpage.html?link=2" class="secondlink"> Second Link </a> 

在您的第二頁上，使用類似這樣的函數來獲取URL參數。http://jquerybyexample.blogspot.com/2012/06/get-url-parameters-using-jquery.html

function GetURLParameter(sParam) 
{ 
    var sPageURL = window.location.search.substring(1); 
    var sURLVariables = sPageURL.split('&'); 
    for (var i = 0; i < sURLVariables.length; i++) 
    { 
     var sParameterName = sURLVariables[i].split('='); 
     if (sParameterName[0] == sParam) 
     { 
      return sParameterName[1]; 
     } 
    } 
}​ 

使用上述功能

if (GetURLParameter('link') === '1') { 
    $(".divA").css("display","none"); 
    $(".divB").css("display","block"); 
} else { 
    $(".divA").css("display","block"); 
    $(".divB").css("display","none"); 
} 

Answer 5

如果你不想使用cookie，那麼你必須通過URL參數傳遞值。

以下功能將幫助您獲得帕拉姆，

function getParameter(param) { 
       var val = document.URL; 
       var url = val.substr(val.indexOf(param)) 
       var n=parseInt(url.replace(param+"=","")); 
       alert(n+1); 
} 
getParameter("page"); 

http://www.example.com/newpage.html?page=firstlink 

我希望這會幫助你。