根據從多個選擇框中發送的值構建URL

我正在某個電子商務網站上工作，我在每個產品類別中都有一堆過濾器。過濾器顯示在選擇框中，每個過濾器都有多個值。例如，如果您正在瀏覽手錶類別，可能的過濾條件是：品牌（天梭，Certina，Timex），機芯類型（自動，機械，石英），計時碼錶（是，否）。根據從多個選擇框中發送的值構建URL

每個選擇選項的值是一對過濾器ID和過濾器選項ID，用逗號分隔。

例如：

<label for="filter-sex">Sex</label> 
<select id="filter-sex" name="filter-sex"> 
    <option value="">All</option> 
    <option value="1,1">For her</option> 
    <option value="1,2">For him</option> 
</select> 

<label for="filter-brand">Brand</label> 
<select id="filter-brand" name="filter-brand"> 
    <option value="">All</option> 
    <option value="3,10">Tissot</option> 
    <option value="3,11">Certina</option> 
</select>

我想什麼來完成是通過在URL中的值。

例如，如果我選擇「對於她的」來自上面提到的過濾器，我的URL必須看起來像http://www.mystore.com/watches/filters-1,2/

然後，如果我從品牌過濾器中選擇天梭，URL必須看起來像http://www.mystore.com/watches/filters-1,2-3,10/

任何想法如何根據選定的值構建該URL？

來源

2011-11-19 Psyche

我假設你有一個按鈕，當用戶點擊時，它將他們帶到網址，對不對？

$('select').change(function(){ 
buildURL(); 
}); 

function buildURL(){ 
    var baseUrl = 'http://www.mystore.com/watches/filter'; 
    var url = baseUrl; 
    $('select').each(function(index, value){ 
     if(value.value != "") 
      url += '-' + value.value; 
    }); 
    $('#url').html(url); 
}

對於這個版本，看看：http://jsfiddle.net/jCq9U/

如果你想做到這一點的服務器端，這將是相同的邏輯。

$baseUrl = 'http://www.mystore.com/watches/filters'; 
$filterSex = $_POST['filter-sex']; 
$filterBrans = $_POST['filter-brand']; 

header('Location: ' . $baseUrl . "-" . $filterSex . "-" . $filterBrand);

來源

2011-11-19 16:33:26

聖何塞，與您的解決方案的問題是，如果我從一個過濾器中選擇另一個值之前選擇的，該值將被添加到URL，但沒有刪除以前選擇的值。例如，如果我從性別過濾器中選擇「For her」，然後選擇「For him」，使用您的解決方案，我將在url中爲「她」和「爲他」，這是不好的。 – Psyche

你使用的是JavaScript版本還是PHP版本？ –

我用javascript創建了一個jsfiddle版本，它不會給我任何問題。 –

根據從多個選擇框中發送的值構建URL

回答

相關問題