Jquery: Seleccione el elemento que llamó a la función

Question

Estoy llamando a una función en el elemento mismo a través de un atributo onclick porque necesito php para dar dinámicamente un valor en uno de los parámetros de las funciones. Cuando intento hacer referencia al elemento que llama en la función a través de "$ (this)", termina haciendo referencia a toda la ventana y no al elemento. ¿Cómo puedo solucionar esto?

Answer 1

Dudo que realmente necesite usar un atributo onclick en línea. Puede almacenar datos en un elemento de diferentes maneras. Es difícil decir exactamente cómo lo haría sin saber cuál es el parámetro que necesita aprobar, pero le daré algunos ejemplos.

El más flexible sería probablemente en un atributo data-:

<a href="#" id="subject" data-type="fiction">Text</a> 

A continuación, puede acceder a la información de la siguiente manera:

$(document).ready(function(){ 
    $('#subject').click(function(){ 
     $type = $(this).data('type'); // this works as of jQuery 1.4.3, otherwise $(this).attr('data-type'); 

     // do your handling here, using $type 
    }); 
}); 

También puede hacerlo utilizando las clases, las etiquetas de secuencia de comandos que crean variables globales, todo tipo de métodos. Es casi seguro que esto será mejor que poner manejadores jQuery en los atributos onclick.

Answer 2

intenta enviar el elemento como parámetro a la función de esa manera:

<input type="text" onclick="myfunction(this);"></input> 

su función debe ser:

<script> 
    function myfunction(currentElement){ 
    // ... 
    } 
</script> 

Answer 3

La solución es almacenar el valor dinámico en un atributo personalizado, no es un controlador onclick. La especificación HTML define cualquier atributo que comience con "datos-" como datos personalizados utilizados exactamente para este tipo de cosas, y está en la especificación, por lo que se validará. Así que usted puede hacer algo como esto (usando PHP para el ejemplo, ajustar en consecuencia):

<input type="text" id="some-input" data-some-dynamic="<?php echo $something; ?>"> 

luego recuperarlo en el Javascript, así:

$(document).ready(function() { 
    $('#some-input').click(function() { 
    // $(this) -- is the input element 
    // $(this).attr('some-dynamic-attribute') -- contains the dynamic data you need 
    }); 
}); 

Creo que este método es superior a la utilización de los manipuladores de atributos como onclick = "", simple porque es más sólido desde una perspectiva de diseño; separación de preocupaciones y todo eso.