使用Javascript / jQuery在基於段的URL中獲取查詢字符串

Question

我正在使用PHP框架Codeigniter，它使用基於段的URL，如http://www.mydomain.com/age/11/name/john/color/red而不是通常的查詢字符串http://www.mydomain.com/index.php?age=11&name=john&color=red 。

如何使用Javascript / jQuery從URL獲取age鍵的值？

在獲取值11我將在觸發事件時將其傳遞給jQuery對象。

$( "#searchdistance_slider" ).slider({
        range: "min",
        value: 5,
        min: 0.5,
        max: 10,
        slide: function( event, ui ) {
            $( "#search_distance" ).val(ui.value + " miles");
            window.location.replace("http://www.domain.com/" + age); 
            /* passing the value of age into URL to redirect to */
        }
    });

UPDATE

• 鍵/值對可以改變位置 ，並且URL中的鍵/值對的數量不固定
• 我需要在Javascript中獲取值，因為用戶使用滑塊來更改特定值，例如age ，並且滑塊中的新值20將用於將用戶重定向到http://www.mydomain.com/age/20/name/john/color/red

Answer 1

您可以嘗試使用jQuery URL解析器插件。

使用.segment(n)調用來搜索"age"的URL路徑，並獲取下一個應包含您要查找的年齡值的路徑。

或者，如果age總是在同一位置，請嘗試使用.fsegment(n)方法。

或者使用.segment() ：

var parts = $.url(your_url).segment();
var params = [];
for (var i=0; i<parts.length/2; i++) {
   params[parts[2*i]] = parts[2*i+1];
}
var age = parseInt(params['age']);

（我確信有更好的方法可以做到這一點。）

如果您只想要age部分，則不必將所有內容填入字典中。 當您找到所需的密鑰時，請盡早退出循環。

如果要重建具有更改年齡的路徑，請嘗試以下操作：

var parts = $.url(your_url).segment();
var newpath = '';
for (var i=0; i<parts.length/2; i++) {
  if (parts[2*i] == 'age') {
    newpath += '/age/' + (parseInt(parts[2*i+1]) + 42); // put your age modifiy
                                                        // code here
  } else {
    newpath += '/' + parts[2*i] + '/' + parts[2*i+1];
  }
}
alert(newpath);

Answer 2

你可以用這樣的東西拆分它：

var parts = {},
    bits = location.pathname.substr(1).split('/'); // get rid of first / and split on slashes

for (var i = 0; i<bits.length; i += 2) {
    parts[bits[i]] = bits[i+1];
}

然后，您可以使用parts.age訪問age值。

Answer 3

在運行代碼之前，將以下內容添加到php腳本中：

<?php
$getAgre = ( isset($_GET['age']) && strlen($_GET['age'])>0 )? $_GET['age'] : 'null';
echo '<script>var age = '. $getAge .';</script>';
?>

編輯：請確保您有一些安全的顯示$ _GET [“年齡”]，你的JS內容，當你在.slider（）事件檢查GET變量是否存在會更好之前檢查

Answer 4

您可以使用window.location.href變量，該變量將為您提供整個當前URL，然后稍微使用該字符串來獲取所需信息。 子串，拆分，甚至正則表達式。

這可行：

var ageMatch= window.location.href.match(/age\/([\d]*)/);
var age= ageMatch[1];

只是為了記錄，您還可以輕松更新網址：

var newUrl= window.location.href.replace(/age\/([\d]*)/, age);
window.location.href= newUrl;