Pasar múltiples parámetros tipo hash en url

Question

Estoy creando un sitio web dinámico usando jQuery y Ajax. He resuelto el problema del historial y el botón Atrás con el Complemento de historial. Quiero pasar múltiples parámetros tipo hash en url sin volver a cargar toda la página en eventos de clic. Quiero algo como:

• something.php#type=abc&id=123 o
• something.php/?type=abc&id=123 ...

¿Cuál podría ser la mejor manera de pasar y recuperar tales parametros poco en url?

<a href="#type=abc&id=123">Click</a> 

if(type==abc && id==123) 
{ 
    do this.. 
} 

Normalmente hacemos esto, <a href="something.php?type=abc&id=123">Click</a> pero vuelve a cargar la página entera.

Answer 1

El valor hash tiene un conjunto limitado de caracteres que están técnicamente permitidos en él. Si nos fijamos en el URL spec aquí, el valor hash se llama fragmentid. Aquí está la gramática por lo que puede contener:

 
fragmentid    xalphas 
xalphas     xalpha [ xalphas ] 
xalpha     alpha | digit | safe | extra | escape 
safe     $ | - | _ | @ | . | & | + | - 
extra     ! | * | " | ' | (|) | , 
escape     % hex hex 
alpha     a | b | c | d | e | f | g | h | i | j | k | 
         l | m | n | o | p | q | r | s | t | u | v | 
         w | x | y | z | A | B | C | D | E | F | G | 
         H | I | J | K | L | M | N | O | P | Q | R | 
         S | T | U | V | W | X | Y | Z 
digit     0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 

Se dará cuenta de que se puede tener &, pero no = a menos que llame encodeURIComponent y decodeURIComponent en el valor hash al establecer o recuperarla.

En cuanto a la técnica que debe utilizar, depende de usted. Puedes hacer tu propia pequeña sintaxis en el valor hash si necesitas representar varios parámetros allí. Personalmente, probablemente separaría los valores con & como en la cadena de consulta, pero use - en lugar de =.

Answer 2

En términos de URI, en realidad puede hacer lo que está pidiendo.

@ jfriend00 es correcto porque no se puede usar "=" en el nombre/valor de un valor de hash dado, sin embargo, creo que han leído mal la especificación de lo que realmente significa. Tampoco puede usar el carácter "=" en el nombre/valor en la cadena de consulta de una URL. ¿Por qué? Porque tiene un significado especial al denotar un par de clave/valor. Sirve para el mismo propósito en el hash (también conocido como fragmentid), que es exactamente como lo estás usando en tu ejemplo.

Si nos fijamos en la w3.org page for media fragments, la tercera frase dice:

La sintaxis se basa en la especificación de ciertos pares de nombre-valor que se puede utilizar en el fragmento URI y las solicitudes de consulta URI para restringir un medio de comunicación recurso a un cierto fragmento.

Observe que puede usar pares de clave/valor tanto para la consulta como para la parte hash de un URI. Si nos fijamos further down in the page, encontrará que describe el formato exactamente como usted lo está utilizando en el fragmentid:

una lista de pares de nombre y valor se codifica en el componente de consulta o un fragmento de un URI. Los componentes de nombre y valor están separados por un signo igual (=), mientras que los pares de nombre y valor están separados por un símbolo comercial (&).

Dicho esto, JavaScript no tiene una forma incorporada de acceder a los pares clave/valor de una manera estructurada (al igual que no tiene una forma incorporada para acceder a los pares clave/valor de la cadena de consulta). Por lo tanto, tendría que construir su propia función de hacer eso, y hay un par de otras críticas en StackOverflow que ya muestran cómo hacerlo:

• Parse URL # fragment with javascript
• Parsing URL hash/fragment identifier with JavaScript
• Split and parse window.location.hash