/ / Usando “this” dentro de la función nombrada en un complemento de jQuery - javascript, jquery, jquery-plugins

Uso de "this" dentro de la función con nombre en un complemento de jQuery - javascript, jquery, jquery-plugins

Estoy tratando de escribir un complemento simple de jQuery y necesito algo de código para ejecutarlo tanto en la carga como en el tamaño de la ventana, así que escribí una función dentro del complemento.

jQuery (documento) .ready (función ($) {

(function( $ ) {

$.fn.responsiveNav = function() {

function enable_responsive_nav() {

if( this.hasClass("class") ) {
//do stuff
}

}

$(window).resize(function(e) {
enable_responsive_nav();
});
enable_responsive_nav();

return this;

};

}( jQuery ));

$("nav").responsiveNav();

El problema es que "esto" no parece ser reconocido dentro de la función. Intenté pasarlo como un argumento de función:

enable_responsive_nav( this )

... pero luego aparece un error en la consola que dice que hasClass () "no es una función".

Supongo que podría hacerlo sin la función y luego vincular el evento de cambio de tamaño de la ventana fuera del complemento, pero estoy tratando de mantenerlo en una sola llamada y estoy seguro de que lo que me falta es muy simple.

Respuestas

1 para la respuesta № 1

Una solución común es crear una variable local llamada that o self en el ámbito donde this tiene el valor esperado, y luego para referirse a la variable local en el alcance de la función interna:

(function( $ ) {

$.fn.responsiveNav = function() {
var self = this; // local variable
function enable_responsive_nav() {

if( self.hasClass("class") ) { // self is in scope
//do stuff
}

}

$(window).resize(function(e) {
enable_responsive_nav();
});
enable_responsive_nav();

return this;

};

}( jQuery ));

$("nav").responsiveNav();

1 para la respuesta № 2

Intenté pasarlo como un argumento de función:

enable_responsive_nav( this )

Sigamos la cadena a través de:

jQuery llamará a su evento con devolución de llamada this haciendo referencia a la Elemento DOM (no objeto jQuery) en el que se conectó el evento. Así que puedes hacer esto:

enable_responsive_nav( $(this) );

...con

if( arg.hasClass("class") ) {
//do stuff
}

O

enable_responsive_nav.call(this);

con

if($(this).hasClass("class") ) {
//do stuff
}