En jQuery, cómo pasar el elemento que se ha hecho clic en el método que se llama el evento onclick

Question

He varias de estas líneas en una página:

<div class="save-button" onclick="Save()">Save</div> 

En mi método Save() quiero manipular la div que se hizo clic para llamar al método Save(). ¿Cómo paso eso (creo que $(this)), sin recurrir a los ids?

¡Muchas gracias!

Answer 1

quite el save() y utilizar click() para atrapar el evento:

<div class="save-button">Save</div> 
<script> 
$('.save-button').click(function() { 
    // Now the div itself as an object is $(this) 
    $(this).text('Saved').css('background', 'yellow'); 
}); 
</script> 

^{[View output]}

O si usted insiste en usar esas funciones a medida save():

<div onClick="save(this)">Save</div> 
<script> 
$(function() { 
    save = function (elm) { 
     // Now the object is $(elm) 
     $(elm).text('Saved').css('background', 'yellow'); 
    }; 
}); 
</script> 

^{[View output]}

EDITAR (2015):.on ('clic', función)

<div class="save-button">Save</div> 
<script> 
$('.save-button').on('click', function() { 
    // Now the div itself as an object is $(this) 
    $(this).text('Saved').css('background', 'yellow'); 
}); 
</script> 

Answer 2

simplemente se refieren a ella como: $(this)

Answer 3

bastante sencillo ...

$('#myDiv').click(function(){ 
    save($(this)); 
}) 


function save($obj){ 
    $obj.css('border', '1px solid red'); 
} 

Answer 4

Dentro de la función Save() this se refiere al elemento DOM que se ha hecho clic. Puede convertir esto en un objeto jQuery con $(this).

Esto se refiere a window por defecto sin embargo, por lo que tendrá que pasar this como un parámetro de la función Guardar:

<div class="save-button" onclick="Save(this)">Save</div> 

function Save(div) { } 

ahora dentro de Guardar, puede utilizar div para referirse a la div que era clickeado

Estaba confundido acerca de cómo se comportó this. Este enlace me ayudó: http://www.quirksmode.org/js/this.html

Answer 5

Dentro del controlador de eventos, this se refiere al elemento cliqueado. Sin embargo, dentro de la función a la que llama desde el controlador de eventos, que es Save, this se referirá a la ventana.

Puede establecer explícitamente lo this debe hacer referencia a dentro Save través call^[MDN] (o apply):

onclick="Save.call(this, event || window.event);" 

entonces usted puede usarlo dentro de la función como $(this):

function Save(event) { 
    // `this` refers to the clicked element 
    // `$(this)` is a jQuery object 
    // `event` is the Event object 
}; 

Pero como está utilizando jQuery, realmente debería hacer

$('.save-button').click(Save); 

para vincular el controlador de eventos. Mezclar marcado con lógica no es un buen estilo. Debe separar la presentación de la lógica de la aplicación.

O si quieres Save para aceptar un elemento como parámetro, a continuación, sólo tiene que pasar que:

onclick="Save(this);" 

y con jQuery:

$('.save-button').click(function() { 
    Save(this); 
});