Pregunta

Tengo un código como éste en mi página:

<div class="item item_wall id1"></div>
<div class="item item_wall id2"></div>
<div class="item item_wall id3"></div>
<div class="item item_wall id4"></div>
<div class="item item_wall id5"></div>

Quiero algo en jQuery para que cuando se hace clic en un div con la clase del "elemento", se carga otra div desde una página, nombre de archivo de la página dependerá de la div clic. Preferiblemente i gustaría que carga:

  

something.php? Type = & id = item_wall id1

Para referencia futura, esto es lo que terminó con:

<div id="itemstable" class="item_love">
    <div class="id1"></div>
    <div class="id2"></div>
    <div class="id3"></div>
    <div class="id4"></div>
    <div class="id5"></div>
    <div class="id6"></div>
</div>

jQuery:

<script>
$("#itemstable div").click(function(){
    var url = "something.php?type=" + $(this).parent().attr("class") + "id=" + $(this).attr("class");
    alert(url);
}); 
</script>
¿Fue útil?

Solución

Haciendo eco de la respuesta de la chaqueta de punto Ruport, se puede hacer esto más fácil cuando se utiliza jQuery para utilizar atributos personalizados distinta clase.

Por ejemplo, su DIV puede tener este aspecto:

<div class="item" type="item_wall" id="1"></div>

Puede crear fácilmente selector de jQuery y eventos como el siguiente:

$(".item").click(function() {
    var url = "something.php?type=" + $(this).attr("type");
    windows.location = url;
});

Por supuesto, no se olvide de comprobar la validez, la entrada del usuario no confianza (su código HTML puede ser reescrito por un usuario malicioso).

Otros consejos

Para XHTML documento válido, lo más fácil es añadir DIV niño invisible bajo su DIV principal. Ej .:

<div class="item">
  <div class="variable type">item_wall</div>
  <div class="variable id">1</div>
</div>

Puede encontrar el "atributo personalizado" usando .find (). Por ejemplo:.

$(".item").click(function() {
    var type = $(this).find(".type").val();
    var url = "something.php?type=" + type;
    windows.location = url;
});

Un poco de opinión:. Mezclando datos con la interfaz de usuario se debe evitar

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top