Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   $(this) в теле плагина (https://javascript.ru/forum/jquery/35400-%24-v-tele-plagina.html)

prison47 10.02.2013 02:43

$(this) в теле плагина
 
Помогите пожалуйста разобраться. Есть тело плагина. В html он вызывается на определенном элементе, допустим див с классом box. Соответственно если в плагине обращаться так $(this) нас приведет на див с классом box. А вот в чем проблема: а например хочу найти див с классом too, и на нем вызвать функцию. Например:
$('.too').click(function(){

$(this).действие;

});

Так вот проблема в том что и внутри функции $(this) вызывает класс box. Так вот как мне повесить действия на этот элемент на котором вызван click.

prison47 10.02.2013 05:04

<script type="text/javascript">

$(window).load(function(){

$(".box").plugin(


	);
});
</script>

<div class="box">Click</div> // нажимаем получаем действие, например добавляем в DOM еще один див с классом too при клике на котором он же и закроется.

$('.too').click(function(){

$(this).hide(); // но хайд естественно не сработает потому как this возвратит див с классом бокс

});

danik.js 10.02.2013 05:48

Внутри обработчика собития this ссылается на элемент, в котором возникло событие, то есть на .too

<button class="too">Клик ми</button>
<script src="//code.jquery.com/jquery-latest.min.js"></script>
<script>
    $('.too').click(function(e){
        alert( this.className );
    });
</script>

prison47 10.02.2013 06:10

То что this возвращает это я знаю. Но дело в том что возвращает его как объект, тоесть так уже не получится сделать this.hide();

danik.js 10.02.2013 06:25

this ссылается на чистый DOM-элемент.
Если нужны плюшки из jquery-обертки, просто оборачиваем его в нее:
$(this).hide(). Это же так просто.

<button class="too">Клик ми</button>
<script src="//code.jquery.com/jquery-latest.min.js"></script>
<script>
    $('.too').click(function(e){
        $(this).hide();
    });
</script>

prison47 10.02.2013 06:30

Да но вы забыли что мы все это делаем в теле плагина, а там $(this) выдаст .box

danik.js 10.02.2013 07:22

$('.too').click(fn) регистрирует функцию fn в качестве обработчика события click. При наступлении события click, jQuery вызывает данную функцию, устанавливая в качестве контекста dom-элемент, на котором сработало событие.
И не имеет значения где эта функция находится. Хоть на луне.
В примере выше обработчик регистрировали в глобальном контексте, тоесть window, тем не менее this внутри обработчика не указывает на window, верно?

Другой пример:

<button class="too">Клик ми</button>
<script src="//code.jquery.com/jquery-latest.min.js"></script>
<script>
    (function(){
        alert (this);

        $('.too').click(function(e){
            $(this).hide();
        });

    // вызываем, устанавливая контекстом строку 'Луна'
    }).call('Луна');
</script>

prison47 10.02.2013 16:54

Да получается я вызываю плагин на .box и в теле плагина $(this) всегда возвращает мне тот элемент на котором был вызван плагин. :(

рони 10.02.2013 17:00

prison47,
с каким плагином боритесь? и зачем внутри плагина дополнительная фунция нужна?

prison47 10.02.2013 18:00

Я разбираюсь с созданием плагина. Вот например я хочу вызвать появление дива .too при нажатии на .box. Подключаю плагин на .box
<script type="text/javascript">

$(window).load(function(){

$(".box").plugin(

    );

});

</script>

Все работает, кликаем на .box появляется див .too. А вот теперь я хочу повесить обработчик на див .too например .hide(). То есть при нажатии на .too он исчезает. Но ничего естественно не получается так $(this) даже внутри функции обработчика возвращает тот дом элемент на котором был вызван плагин, тоесть .box


Часовой пояс GMT +3, время: 07:07.