-3

Quiero que me seleccione los elementos que se le de click para darle estilo

 <div id="cont-categoria" class="centFRH">
        <div id="categoria">
          <div class="cont-optionElement">
             <div class='elemento 1' iden='1'>Muros al Maximo</div></div>
          <div class="cont-optionElement">
             <div class='elemento 2' iden='2'>Rey al Maximo</div></div>
          <div class="cont-optionElement">
             <div class='elemento 3' iden='3'>Reina al Maximo</div></div>
          <div class="cont-optionElement">
             <div class='elemento 4' iden='4'>Defensas al Maximo</div></div>
          <div class="cont-optionElement">
             <div class='elemento 5' iden='5'>Tropas al Maximo</div></div>      
     <div class="mensCateg" class="centB">Selecione las Categorias</div>
 </div>

** Funciones Jquery **

    <script>

        jQuery(document).ready(function() {

            $('#categoria').on('click','.elemento',function() {
               var e = $(this).clone();
               var identificador = $(this).attr("iden");

               if($("#campoBusq").find("."+identificador).length){
                    $("#campoBusq").find("."+identificador).remove();
                    $(".cont-optionElement").removeClass("estilSelectCateg");*no funciona*
               }else{
                 $(e).appendTo('#campoBusq');           
                 $(".cont-optionElement").addClass("estilSelectCateg");*no funciona*
               } 
           });

            $('#campoBusq').on('click','.elemento',function() {
               $(this).remove();
            });


        });
  </script>
3
  • Quien me ayuda porfa
    – Gamez
    el 17 mar. 2017 a las 3:27
  • $(this).parents(''.cont-optionElement").find("."+identificador); --- Encontre esto, sera que me sirve
    – Gamez
    el 17 mar. 2017 a las 3:35
  • No creo que no te sea posible explayarte con coherencia. Comunícate a la altura y explica (editando) con solvencia lo que tratas de hacer y lo que hace actualmente el código que has publicado.
    – gugadev
    el 17 mar. 2017 a las 14:17

1 respuesta 1

1

Siendo sincero me costo entender tu pregunta, te recomendaría ser mas especifico al formular una pregunta si quieres una respuesta pronta.

Usando parent checa la linea:

$(this.parentNode).removeClass("estilSelectCateg"); 

Creo que quieres algo asi:

jQuery(document).ready(function() {

            $('#categoria').on('click','.elemento',function() {
               var e = $(this).clone();
               var identificador = $(this).attr("iden");

               if($("#campoBusq").find("."+identificador).length){
                    $("#campoBusq").find("."+identificador).remove();
                    $(this.parentNode).removeClass("estilSelectCateg");
               }else{
                 $(e).appendTo('#campoBusq');           
                 $(this.parentNode).addClass("estilSelectCateg"); 
               } 
           });

            $('#campoBusq').on('click','.elemento',function() {
            	let clases = this.classList;
            	
            	let miCosa = $(`#categoria .${clases[0]}.${clases[1]}`)[0].parentNode;
              
              $(miCosa).removeClass("estilSelectCateg");
               $(this).remove();
            });


        });
.estilSelectCateg { background-color: red; }
.cont-optionElement { border:1px solid blue; padding:10px }
.elemento{ border:1px solid green }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
	<head>
  
	</head>
	<body>
		<div id="cont-categoria" class="centFRH">
        <div id="categoria">
          <div class="cont-optionElement">
             <div class='elemento 1' iden='1'>Muros al Maximo</div></div>
          <div class="cont-optionElement">
             <div class='elemento 2' iden='2'>Rey al Maximo</div></div>
          <div class="cont-optionElement">
             <div class='elemento 3' iden='3'>Reina al Maximo</div></div>
          <div class="cont-optionElement">
             <div class='elemento 4' iden='4'>Defensas al Maximo</div></div>
          <div class="cont-optionElement">
             <div class='elemento 5' iden='5'>Tropas al Maximo</div></div>      
     
     <div class="mensCateg" class="centB">Selecione las Categorias</div>

     <div id="campoBusq" style="border:1px solid black; min-height:50px; margin-top:16px">
     	
     </div>
 </div>	

 </body>
</html>

11
  • Tienes razon cuesta un poco entender la pregunta, como la respondes es la misma manera en la que entendi, espero sea lo que Necesita. el 17 mar. 2017 a las 3:44
  • No amigo, solo busco seleccionar con this a los div: ( elemento ) para darle el estilo a cont-optionElement pero solo al div: que se vaya seleccionando
    – Gamez
    el 17 mar. 2017 a las 3:48
  • Busco algo así: $(".cont-optionElement").addClass("estilSelectCateg"); pero tomando en cuenta; que el this va a seleccionar los divs: ( elemento ) para aplicarle la clase a sus contenedores llamados cont-optionElement
    – Gamez
    el 17 mar. 2017 a las 3:52
  • :s Te deje un fragmento de código por que no lo ejecus y lo tomamos como base para saber que quieres hacer @gam
    – Malcam
    el 17 mar. 2017 a las 4:08
  • Amigo solo falta darle estilo, el resto del código esta bien, solo falta 1 linea de codigo: estoy investigando y encontré el uso de parent; tendría que probarlo asi $(this).parents('.cont-optionElement').addClass("esrilSelectCareg") es decir; quiero que seleccione a cualquier elemento que tiene como clase; (elemento 3)por ejemplo y que parents busque su padre contenedor para luego asignarle con addClass el estilo a .cont-optionElemt
    – Gamez
    el 17 mar. 2017 a las 4:17

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.