如何在URL中使用變量執行Javascript代碼

我真的很少使用Javascript，並且在理解如何使以下方面起作用時遇到了一些麻煩。我的目標是在頁面加載時執行特定的Javascript操作，並且添加到URL末尾的變量將觸發要執行的JavaScript操作。我正在尋找的頁面的URL是http://www.morgantoolandsupply.com/catalog.php。每個由JavaScript驅動的「+ expand」按鈕都會下拉頁面的某個區域。最終，我希望能夠創建一個URL，在頁面加載時自動下拉某個類別。有人可以向我解釋這個過程嗎？預先感謝任何幫助！如何在URL中使用變量執行Javascript代碼

來源

2011-09-02 user924650

謝謝大家幫助我通過這個！我一直在努力尋找一個解決方案好幾天，但所有的答案肯定會增加我對這個應該如何工作的理解。 – user924650

您已經有了調用功能：toggle2()，它採用兩個參數，除了最後一個數字外，其他兩個參數恰好相同。因此，創建一個包含該號碼的網址：http://www.morgantoolandsupply.com/catalog.php#cat=4

然後使用正則表達式在location.hash中找到該號碼。如果您決定在未來使用它們，這個版本足夠強大，可以處理多個網址參數：/[\#&]cat=(\d+)/。但是，如果您希望從不向網址添加其他任何內容，則可以使用簡單的/(\d+)/。

一旦獲得了號碼，使用該號碼創建兩個參數並呼叫toggle2()是一件簡單的事情。

這應該工作：

window.onload = function() { 
    if (/[\#&]cat=(\d+)/.test(location.hash)) { 
     var cat = parseInt(RegExp.$1); 
     if (cat > 0 && cat < 13) { 
      toggle2("toggle"+cat, "displayText"+cat); 
     } 
    } 
}

來源

2011-09-02 05:56:35 gilly3

這個工作完美！非常感謝你的幫助！ – user924650

你必須有點「手動」解析URL，因爲在URL中的參數不會自動傳遞給JavaScript，就像它們在服務器端腳本（通過PHP $_GET，例如）

一方式是使用URL片段標識符，即最後可以使用的「#something」位。這可能是做這件事，因爲碎片不會被髮送到服務器的最巧妙的方法，所以它不會與任何其他參數

// window.location.hash is the fragment i.e. "#foo" in "example.com/page?blah=blah#foo" 
if(window.location.hash) { 
    // do something with the value of window.location.hash. First, to get rid of the "#" 
    // at the beginning, do this; 
    var value = window.location.hash.replace(/^#/,''); 
    // then, if for example value is "1", you can call 
    toggle2('toggle' + value , 'displayText' + value); 
}

的URL「HTTP混淆：//www.morgantoolandsupply。 com/catalog.php＃1「會自動擴展」toggle1「元素。

或者，也可以使用普通的GET參數（即「？富=欄」）

var parameter = window.location.search.match(/\bexpand=([^&]+)/i); 
if(parameter && parameter[1]) { 
    // do something with parameter[1], which is the value of the "expand" parameter 
    // I.e. if parameter[1] is "1", you could call 
    toggle2('toggle' + parameter[1] , 'displayText' + parameter[1]); 
}

window.location.search包含參數，即一切從問號端部或所述URL片段。如果給定URL「example.com/page.php?expand=foo」，則parameter[1]將等於「foo」。所以URL「http://www.morgantoolandsupply.com/catalog.php?expand=1」將擴展「toggle1」元素。

我也許會去尋找一些比URL中的數字更具描述性的東西，例如使用下拉列表的標題（比如「#abrasives」或「expand = abrasives」而不是「＃1」或「expand = 1」），但是這需要對現有頁面進行一些調整，因此稍後請留下以供後續使用

來源

2011-09-02 05:42:45 Flambino

在碎片中填充額外的東西並查看'window.location.hash'可能對客戶端解決方案更好。 –

@ muistooshort：嘿，我正在更新我的回答，準確地提出，當你評論時:) - 我同意，使用片段也是我的首選解決方案。但是當我第一次寫回答的時候，我太忙於GET參數了 – Flambino

不是一個完整的答案（「給一個人一條魚」等等），但您可以從沿着這些線：

// entire URL 
var fullURL = window.location.href; 

// search string (from "?" onwards in, e.g., "www.test.com?something=123") 
var queryString = window.location.search; 

if (queryString.indexOf("someParameter") != -1) { 
    // do something 
}

更多信息可從Mozilla開發者網絡獲得window.location。

話雖如此，鑑於你在談論一個PHP頁面，爲什麼你不使用一些服務器端PHP來實現相同的結果呢？

來源

2011-09-02 05:46:44 nnnnnn

如何在URL中使用變量執行Javascript代碼

回答

相關問題