jQuery - Функция привязки к селектору без события?

Question

Я просто научился определять функцию и называть ее позже. Я застреваю, пытаясь определить «это» в моей функции, не используя событие.

function slide() { 
    var imgAlt = $(this).find('img').attr("alt"); 
    var imgTitle = $(this).find('a').attr("href"); 
    var imgDesc = $(this).find('.block').html(); 
    var imgDescHeight = $(".main_image").find('.block').height(); 

    $(.active); 
    $(".main_image .block").animate({ opacity: 0, marginBottom: -imgDescHeight }, 250 , 
       function() { 
        $(".main_image .block").html(imgDesc).animate({ opacity: 0.85, marginBottom: "0" }, 250); 
        $(".main_image img").attr({ src: imgTitle , alt: imgAlt}); 
       } 
      ); 
    } 
    }); 

В строке 6 вы увидите '$ (. Active); ', и именно здесь я хочу выбрать класс active, а затем применить к нему следующую функцию. Обычно я использовал эту настройку одним щелчком мыши или что-то в этом роде, поэтому я не уверен, как ее внедрить.

Любая помощь очень ценится! Благодаря

Вот JS скрипку, где вы можете увидеть большую картину: http://jsfiddle.net/wzQj6/21/

Answer 1

См линии 3-4 в коде ниже, как кэшировать .active элементов для повторного использования (и затем использовать это вместо this!):

function slide() { 

    //cache all .active elements for reuse 
    var actives = $(".active"); 

    //use the new 'actives' variable instead of 'this' 
    var imgAlt = actives.find('img').attr("alt"); 
    var imgTitle = actives.find('a').attr("href"); 
    var imgDesc = actives.find('.block').html(); 
    var imgDescHeight = $(".main_image").find('.block').height(); 

    //$(.active); -- not sure what you were doing with this :p 
    $(".main_image .block").animate({ opacity: 0, marginBottom: -imgDescHeight }, 250 , 
       function() { 
        $(".main_image .block").html(imgDesc).animate({ opacity: 0.85, marginBottom: "0" }, 250); 
        $(".main_image img").attr({ src: imgTitle , alt: imgAlt}); 
       } 
      ); 
    } 
    }); 

Ура!

Answer 2

Когда вы вызываете функцию, то this внутри его объема (также называемый контекст), как правило, объект, который владеет и вызывает указанную функцию. (Т.е. с foo.bar(), внутри bar(), this == foo нормально.)

В Javascript, если вы хотите, чтобы вызвать функцию и указать, какой контекст функции, вы можете использовать метод call как так:

bar.call(foo); 
// inside bar, this == foo, even if foo wasn't the owner/caller of the function 

Вы не разместили код для функции, которую вы действительно хотите вызвать, поэтому я не могу прокомментировать, является ли это (наиболее) правильным способом для вас, но из того, что я понимаю, это должно работать для тебя.

// take note, also, that your syntax for selecting .active is incorrect. 
// you should be passing in a string. 
var active_elements = $('.active'); 
some_function.call(active_elements); 

Answer 3

Насколько я понял ваш вопрос, вы ищете способ вызова функций (jQuery-методов тоже) в области видимости, а именно контекст javascript, который вы готовите отдельно. Если да, вот мой пример кода и объяснения.

var el = $('.active'); 
$.fn.animate.call(el, options, timeout, function() { 
    var active = this; 
    // do whatever you need 
}); 

1. JQuery анимации функция определена в пространстве имен jQuery.prototype, который также является jQuery.fn.
2. Существует два способа вызова функции в боковом контексте. Это apply и call. Вы можете проверить разницу между ними here.

Надеюсь, я помог вам.