2

Buen dia a todos, tengo varios elementos que creo dinamicamente, entonces les agrego la funcion hover con jquery de la siguiente manera:

 $(document).on('mouseenter', '.abtnTest', function ()
{
  console.log("In Hover: " + this.Id);
}).on('mouseleave', '.abtnTest', function ()
{
  console.log("Out Hover: " + this.Id);
});

Intento como esta el codigo dentro de console.log, de obtener el Id del elemento al cual le hago hover, pero no me funciona. Saben si hay alguna posibilidad de obtener el Id sobre el cual se le hace hover?.

Nota: los elementos se crean dinamicamente.

2
  • qué elementos quieres aumentar o modificar? son imágenes, inputs...?
    – Pak Lei
    Commented el 20 jun. 2019 a las 18:30
  • es un span, deseo obtener su id, y le agrego la funcion hover con la clase ".abtnTest"
    – PolloKulos
    Commented el 20 jun. 2019 a las 18:31

3 respuestas 3

4

Para obtener el id del elemento al que realizas hover el código es el siguiente:

$(".abtnTest").hover(function() {
    let elementId = $(this).attr("id");
    console.log(elementId);
});

O también:

$(".abtnTest").on("hover", function() {
    let elementId = $(this).attr("id");
    console.log(elementId);
});

El segundo se utiliza más cuando vas agregando elementos dinámicamente.

0

podemos hacer uso de las funciones onmouseover y onmouseout de html para llamar a las funciones que te permitan obtener el id. Supongo que lo siguiente es lo que necesitas implementar:

    <script>
        function adentro(x) {
            console.log("ahora estoy adentro");
        }
    
        function afuera(x) {
            console.log("ahora estoy afuera")
        }
    </script>
    
    
    <span onmouseover="adentro(this)" onmouseout="afuera(this)">
        <h2>Pollo</h2>
    </span>

0

Usando this.id puedes lograrlo. El ámbito de las funciones anónimas (no funciones con flecha [e => process(e)]) para eventos de elementos es el mismo elemento

$(document.body).append($('<button id="btn">Prueba</button>').hover(function(e){ console.log(this.id, "over")}, function(e){ console.log(this.id, "out")}))
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

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.