2011-08-01 71 views
12

Mi dirección actual es: http://something.com/mobiles.php?brand=samsung¿Cómo agregar un parámetro a la URL?

Ahora, cuando un usuario hace clic en un filtro de precio mínimo (digamos 300), quiero que mi URL para convertirse en

http://something.com/mobiles.php?brand=samsung&priceMin=300

En otras palabras, Busco una función de javascript que agregará un parámetro específico en la URL actual y luego redirigirá la página web a la nueva URL.

Nota: Si no se establecen los parámetros a continuación, la función debe añadir ? en lugar de &

es decir, si la URL actual es http://something.com/mobiles.php continuación, la página debe ser re-dirigida a http://something.com/mobiles.php?priceMin=300 en lugar de http://something.com/mobiles.php&priceMin=300

+1

algún motivo no se puede generar el lado del servidor o utilizar un enlace ¿formulario web? – zzzzBov

+0

Estoy de acuerdo con @zzzzBov, luego puede convertir su filtro de precio mínimo en un enlace dinámico. – iLLin

+1

Hay muchos filtros en mi sitio web como el nombre de marca, rango de precios, ordenar por popularidad, ordenar por precio y muchos otros. Para generar la URL en el lado del servidor se necesitan muchas instrucciones 'if-else' y se generará una carga innecesaria en el servidor. Estoy buscando específicamente el cambio de URL en el lado del cliente. ¡Gracias! –

Respuesta

16

intentar algo como esto, se debe tener en cuenta también los casos cuando ya se tiene que parámetro en la URL:

function addOrUpdateUrlParam(name, value) 
{ 
    var href = window.location.href; 
    var regex = new RegExp("[&\\?]" + name + "="); 
    if(regex.test(href)) 
    { 
    regex = new RegExp("([&\\?])" + name + "=\\d+"); 
    window.location.href = href.replace(regex, "$1" + name + "=" + value); 
    } 
    else 
    { 
    if(href.indexOf("?") > -1) 
     window.location.href = href + "&" + name + "=" + value; 
    else 
     window.location.href = href + "?" + name + "=" + value; 
    } 
} 

continuación, se invoca como en su caso:

addOrUpdateUrlParam('priceMin', 300); 
+0

Si un parámetro llamado 'mypriceMin' ya es parte de location.href, también podría cambiarlo, así que tenga cuidado de que el código realmente funcione para su propósito. Además, la expresión regular debe ejecutarse solo en la parte de búsqueda, no en la href completa. – hakre

+0

@hakre solucionó el problema "mypriceMin" :) en cuanto a la parte de búsqueda solamente - sí, sería más eficiente en cadenas más cortas, por supuesto esta no es la solución óptima, cualquiera puede ajustarla a su gusto – petho

+0

Agregó una función a continuación que realmente comparará los nombres de los parámetros normalizados, los parámetros del conjunto que ya existen y no tienen ningún valor y eliminan los parámetros duplicados. Y funciona solo en búsqueda, no es necesario tratar con el resto del URI. – hakre

4
if(location.search === "") { 
    location.href = location.href + "?priceMin=300"; 
} else { 
    location.href = location.href + "&priceMin=300"; 
} 

En el caso location.search === "", entonces no hay ? parte.

Agregue ?newpart para que se convierta en .php?newpart.

De lo contrario, ya existe una parte ?.

Agregue &newpart para que se convierta en .php?existingpart&newpart.


Gracias a hakre, también se puede establecer simplemente se siente:

location.search += "&newpart"; 

Se añadirá automáticamente ? si es necesario (si no es aparente, que hará que sea ?&newpart esta manera, pero que no debe importar).

+0

No hay necesidad de 'if' en su ejemplo, exactamente lo mismo se puede hacer por 'location.search + =" & priceMin = 300 ";' solamente. – hakre

+0

@hakre: Lo siento, pero el 'si' está ahí para distinguir realmente entre'? 'Y' & '. – pimvdb

+1

Lo cual es superfluo ya que puede hacer uso de 'search' que no requiere establecer'? 'Si aún no es parte de él. Con tu código, incluso lo agregarías detrás de la parte hash al final ahora como yo lo veo, prueba con 'test.html? A = b # filter'. – hakre

0

Si desea que el usuario complete un campo de texto con un precio mínimo, ¿por qué no permite que el formulario se envíe como solicitud GET con una acción en blanco? IIRC, eso debería hacer justo lo que quiera, sin ningún javascript.

0

uso var urlString = window.location Obtenga la dirección

de verificación si la URL ya contiene un '?' con urlString.indexOf('?'), -1 significa que no existe.

conjunto window.location para redirigir

esto es como 101 de JavaScript. prueba algunos motores de búsqueda!

0
<FORM action="" method="get"> 
<P> 
<LABEL for="brand">Brand: </LABEL> 
      <INPUT type="text" id="brand"><BR> 
<LABEL for="priceMin">Minimum Price: </LABEL> 
      <INPUT type="text" id="priceMin"><BR> 
</P> 

1
var applyMinPrice = function(minPrice) { 
    var existingParams = (location.href.indexOf('?') !== -1), 
     separator = existingParams ? '&' : '?', 
     newParams = separator + 'priceMin=' + minPrice; 

    location.href += newParams; 
} 
13

Actualmente esto es totalmente trivial, porque el objeto de ubicación javascript ya se ocupa de esto. Sólo encapsular esta sola línea en una función para volver a usarlo con enlaces etc:

<script> 
    function addParam(v) { 
     window.location.search += '&' + v; 
    } 
</script> 

<a href="javascript:addParam('priceMin=300');">add priceMin=300</a> 

No hay necesidad de comprobar si hay ? como esto ya es la parte search y sólo tiene que añadir el parámetro.

Si no desea incluso hacer uso de una función se puede escribir como tan:

<a href="javascript:location.search+='&priceMin=300';">add priceMin=300</a> 

Tenga en cuenta que esto es exactamente lo que has pedido para: Para añadir ese parámetro específico. Ya puede ser parte de la parte search porque puede tener el mismo parámetro más de una vez en un URI. Es posible que desee normalizar eso dentro de su aplicación, pero ese es otro campo. Centralizaría la normalización de URL en una función propia.

Editar:

En la discusión sobre la respuesta aceptada anterior se hizo evidente, que las siguientes condiciones se deben cumplir para obtener una función de trabajo:

  • si el parámetro ya existe, lo que debería ser cambiado.
  • si el parámetro ya existe varias veces, solo la copia modificada debería sobrevivir.
  • si el parámetro ya existe, pero no tiene ningún valor, se debe establecer el valor.

Como search ya proporciona la cadena de búsqueda, lo único que queda para lograr es procesarla y consulta de información parte en el nombre y valor de pares, cambiar o añadir el nombre de falta y el valor y luego añadir de nuevo a search :

<script> 
    function setParam(name, value) { 
     var l = window.location; 

     /* build params */ 
     var params = {};   
     var x = /(?:\??)([^=&?]+)=?([^&?]*)/g;   
     var s = l.search; 
     for(var r = x.exec(s); r; r = x.exec(s)) 
     { 
      r[1] = decodeURIComponent(r[1]); 
      if (!r[2]) r[2] = '%%'; 
      params[r[1]] = r[2]; 
     } 

     /* set param */ 
     params[name] = encodeURIComponent(value); 

     /* build search */ 
     var search = []; 
     for(var i in params) 
     { 
      var p = encodeURIComponent(i); 
      var v = params[i]; 
      if (v != '%%') p += '=' + v; 
      search.push(p); 
     } 
     search = search.join('&'); 

     /* execute search */ 
     l.search = search; 
    } 
</script> 

<a href="javascript:setParam('priceMin', 300);">add priceMin=300</a> 

Esto al menos es un poco más robusto, ya que puede hacer frente a las URL como éstas:

test.html?a?b&c&test=foo&priceMin=300 

O incluso:

test.html?a?b&c&test=foo&pri%63eMin=300 

Además, el nombre y el valor agregados siempre están codificados correctamente. Donde esto podría fallar es si el nombre de un parámetro da como resultado una etiqueta de propiedad ilegal js.

+0

Gracias, esta función setParam es realmente útil. ¿Hay alguna manera de llamarlo más de una vez para configurar múltiples parámetros? – Alex

+0

¡gracias funciona a la perfección! – sputn1k

0
<html> 
<body> 
.. 
.. 
.. 

<?php 
$priceMinValue= addslashes ($_GET['priceMin']); 
if (!empty($priceMin)) { 
     $link = "currentpage.php?priceMin=". $priceMinValue; 
     die("<script>location.href = '".$link. "'</script>");  
} 
?> 
</body> 
</html> 
+0

quería un javascript del lado del cliente, no del lado del servidor – JaMaBing

2

que volver a escribir la correcta respuesta en PHP:

function addOrUpdateUrlParam($name, $value){ 
$href = $_SERVER['REQUEST_URI']; 
$regex = '/[&\\?]' . $name . "=/"; 
if(preg_match($regex, $href)){ 
    $regex = '([&\\?])'.$name.'=\\d+'; 
    $link = preg_replace($regex, "$1" . $name . "=" . $value, $href); 
}else{ 
    if(strpos($href, '?')!=false){ 
     $link = $href . "&" . $name . "=" . $value; 
    }else{ 
     $link = $href . "?" . $name . "=" . $value; 
    } 
} 
return $link; 
} 

espero que alguien de esa ayuda ...

Cuestiones relacionadas