Put a variable inside a Jquery

Question

Put a variable inside a Jquery

Navigation

#1 by (1 votes)
#2 by (0 votes)

1

I'm doing a product query that pulls the item of a database. At the moment of giving click in a link this shows a content.

What happens is that these item are within a bucle While . What I want is to get that by clicking on more info the product information is displayed.

For this I require the content of a variable to be within a selector JQuery .

I would like to know what the syntax would be.

I have the following code:

<div class="informacion">
<p class="info_pro col-md-6"><a href="#enlace<?php echo $fila[ind];?>" class="enlace_detalles">VER DETALLES</a></p>
<p class="icon_call col-md-6">
<a href="tel:013095009"><i class="fa fa-phone"></i></a>
<a href="mailto:[email protected]"><i class="fa fa-envelope-o"></i></a>
</p>
</div>
<div id="enlace<?php echo $fila[ind];?>" class="detalles_p">
<div class="detalle_img">
<img src="<?php echo"$fila[ruta]"; ?>" class="img-responsive">
</div>
<div class="detalles_info">
<p><i class="detalle_item">INDICE:</i><?php echo"$fila[ind]" ?></p>
<p><i class="detalle_item">MATERIAL:</i><?php echo"$fila[material]" ?></p>
<p><i class="detalle_item">CANTIDAD:</i><?php echo"$fila[cantidad]" ?></p>
<p><i class="detalle_item">IMPRESIÓN:</i><?php echo"$fila[impresion]" ?></p>
<p><i class="detalle_item">TAMAÑO:</i><?php echo"$fila[tamano]" ?></p>
<p><i class="detalle_item">PRESENTACIÓN:</i><?php echo"$fila[presentacion]" ?></p>
<p><i class="detalle_item">SERVICIO DE ENTREGA:</i><?php echo"$fila[servicio]" ?></p>
</div> en<?php echo $fila[ind];?>
<div class="detalles_bn">
<a href="tel:013095009">Llama al proveedor <i class="fa fa-phone"></i></a>
<a href="mailto:[email protected]">Solicitar cotización <i class="fa fa-envelope-o"></i></a>
<p>"SpamBot Automatic: Opps!!, Este servicio borra automáticamente todos los correos de servidores gratuitos, por lo que agradeceremos enviar su requerimiento desde su correo corporativo."</p>
</div>
</div>

And this is my Jquery .

  $(".enlace_detalles").click(function(){
        var href= $(this).attr('href');
        var hrefnew="'"+ href + "'";
        Aqui es donde no se como llamar a mi variable?
    });

Let's see to make it more accurate ... I want to put the contents of a variable inside a Jquery selector ... How do I do it?

$ (".link_details"). click (function () { var href = $ (this) .attr ('href'); var hrefnew="'" + href + "'"; $ (hrefnew) .slideUp ("slow"); < --- This is what is not done ... });

The class ".link_details" is the link that opens the div that contains the info ... but being in a loop ... I click on this link and all divs open or close. and what I want is that if I click on item1 I open the item1 detail ... if I click on item2 I open the item2 detail and so on.

javascript jquery php

asked by Karlos Yalta 09.03.2018 в 17:19

source

2 answers

0

I recommend that you use the Collapse from boostrap, but if you do manual you have to have a reference to which one element you will show, the element <a> you add an attribute in data-aquiloquequieras with a unique value, because you use this to identify the <div> that you need to collapse, in the example I use the id, but it can be any other attribute.

*{
  border-bottom:white;
}
.contenedor{
  width:100%;
  border:green solid 1px;
}
.hidden{
  display:none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="contenedor">
  <a href="#" data-referencia="1" class="mostrar-detalle">1</a>
  <div id="1">Expande 1</div>
</div>
<div class="contenedor">
  <a href="#" data-referencia="2" class="mostrar-detalle">2</a>
  <div id="2" >Expande 2</div>
</div>
<div class="contenedor">
  <a href="#" data-referencia="3" class="mostrar-detalle">3</a>
  <div id="3">Expande 3</div>
</div>
<div class="contenedor">
  <a href="#" data-referencia="4" class="mostrar-detalle">4</a>
  <div id="4">Expande 4</div>
</div>


<script>
$('.mostrar-detalle').on('click', (e)=> {			
	let idMostar = $(e.currentTarget).data().referencia; //puede ser clave o lo que los identifique
  $('#'+idMostar).toggleClass("hidden")		
});
</script>

answered by 09.03.2018 в 23:22

Javascript button to get a Trello token Error trying to install backports: "No matching distribution found for backports"

score 1 · Accepted Answer

What you have to do to show your product is to use the $() selector as you were doing only when you retrieve the id you concatenate it with # as in the example.

$(".div-show").click(function() {
  $(".hide").hide();
  var id = $(this).attr("href");
  $("#" + id).show();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

<div href="myId1" class="div-show">
  <label>Mostrar Mensaje 1</label>
  <label id="myId1" class="hide" style="display:none;">Estoy Oculto 1</label>
</div>
<div href="myId2" class="div-show">
  <label>Mostrar Mensaje 1</label>
  <label id="myId2" class="hide" style="display:none;">Estoy Oculto 2</label>
</div>
<div href="myId3" class="div-show">
  <label>Mostrar Mensaje 1</label>
  <label id="myId3" class="hide" style="display:none;">Estoy Oculto 3</label>
</div>