傳遞變量在另一個頁面上運行

我正在一個網站上工作，並且正在計劃讓它在某些鏈接上設置值，這將改變頁面加載時顯示的容器。我將如何獲得它，以便鏈接傳遞將用於onload函數的值？傳遞變量在另一個頁面上運行

這裏是我的HTML代碼中的樣機：

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <title>Lunch</title> 
     <link rel="stylesheet" type="text/css" href="style.css"> 
       <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script> 
     <script src="script.js"></script> 
    </head> 
<body onload="navBar(); dateChange(); tabulate(0);"> 
    <nav> 
     <ul> 
      <li><a href="appy.html">Appitizers</a></li> 
      <li><a href="break.html">Breakfast</a></li> 
      <li><a href="lunch.html">Lunch</a></li> 
      <li><a href="dinner.html">Dinner</a></li> 
      <li><a href="dessert.html">Dessert</a></li> 
      <li><a href="special.html">Ten-Course Dinner</a></li> 
      <li><a href="share.html">Send in your Recipes!</a></li> 
     </ul> 
    </nav> 
    <div class="main"> 
    <div class="box"> 
     <ul> 
      <li><a onclick="tabulate(this.id);" id="1">Chicken Clubhouse Sandwiches</a></li> 
      <li><a onclick="tabulate(this.id);" id="2">Smokey Tomato Soup</a></li> 
     </ul> 
    </div> 

    <div id="0" class="recipe" style="display: block;"> 
     <div class="tabs"> 
      <a class="tab">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a> 
     </div> 
     <div class="page"> 
      <p>The recipes you'll find here are ones you can use to impress guests at your next get together</p> 
     </div> 
    </div> <!--recipe card end--> 
    <div class="recipe" id="1"> 
     <h1>Chicken Clubhouse Sandwiches</h1> 
    </div> <!--recipe card end--> 
    <div class="recipe" id="2"> 
     <h1>Smokey Tomato Soup</h1> 
    </div> <!--recipe card end--> 

    </div> 
</body> 
</html>

，這裏是我的製表功能：

function tabulate(tabNum){ 
$('.recipe').each(function() { 
    if(tabNum==this.id){ 
     this.style.display="block"; 
    } 
    else{ 
     this.style.display="none"; 
    } 
}); 

}

來源

2017-06-13 Jessica P

只是一個快速的頭的了：你拼錯了「開胃菜」:) – deckeresq

您將需要使用的URL的GET parameters：

lunch.html?item=2

將變量傳入JavaScript函數中：

// Set up an object for GET parameter 
var $_GET = {}; 

// Find and extract the various GET parameters 
if(document.location.toString().indexOf('?') !== -1) { 
    var query = document.location.toString().replace(/^.*?\?/, '').replace(/#.*$/, '').split('&'); 
    for(var i=0, l=query.length; i<l; i++) { 
     var aux = decodeURIComponent(query[i]).split('='); 
     $_GET[aux[0]] = aux[1]; 
    } 
} 

// Target a specific get parameter, given the GET parameter name 
var tabNum = $_GET['item']; // Comes through as '2' in this example 

// Pass the parameter into the function 
function tabulate(tabNum){ 
    $('.recipe').each(function() { 
    if(tabNum==this.id){ 
     this.style.display="block"; 
    } 
    else{ 
     this.style.display="none"; 
    } 
    }); 
}

用於進一步參考參見this post和this post。

希望這會有所幫助！ :)

來源

2017-06-13 21:27:11

這幫了很多！但是，我不需要$ _GET部分，我直接將aux [1]分配給tabNum。 –

這取決於您在GET中傳遞了多少個參數，但是，如果只有一個參數，則該參數將起作用。很高興聽到它幫助你:) –

壞消息，由於某種原因，它不是在託管網站上工作... –

我沒有測試過這一點，但你應該能夠通過PHP傳遞GET變量到製表（），在這樣的方式來獲得的：

function tabulate(tabNum){ 
    $('.recipe').each(function() { 
     if(tabNum==this.id){ 
      this.style.display="block"; 
     } 
     else{ 
      this.style.display="none"; 
     } 
    }); 
} 
window.addEventListener('DOMContentLoaded', function(evt) { 
    var id = <?php echo htmlspecialchars($_GET['id'], ENT_COMPAT, 'utf8'); ?>; 
    tabulate(id); 
});

來源

2017-06-13 21:29:25 hRdCoder

我相信，這將工作，但我使用的託管網站不支持PHP –

對不起。我想我假設你有PHP可用。在這種情況下，您可能需要發揮創意。 – hRdCoder

沒關係，我應該說我從一開始就沒有PHP訪問權限 –

傳遞變量在另一個頁面上運行

回答

相關問題