Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
Карта форума Темы раздела Блоги Сообщество Поиск Заказать работу  
 
 
Рейтинг 4.71/222: Рейтинг темы: голосов - 222, средняя оценка - 4.71
75 / 75 / 13
Регистрация: 02.02.2012
Сообщений: 462
1

разница this и $(this)

02.04.2012, 15:39. Показов 45129. Ответов 20
Метки нет (Все метки)

Author24 — интернет-сервис помощи студентам
в книге вот такой пример
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$(function(){
   $('li:has(ul)').css({'cursor':'pointer','list-style-image':'url(plus.gif)','font-size':'16px'})
   .click(function(event){
        if(this == event.target){
            if(!$(this).children().is(':hidden')){
                $(this).css('list-style-image', 'url(plus.gif)').animate({'color':'#FF0000', 'font-size':'16px'},100);
            }else{
                $(this).css('list-style-image', 'url(minus.gif)').animate({'color':'#0000FF', 'font-size':'20px'},100);
            }
            $(this).children().toggle('normal');
        }
        return false;
   }).children().hide().css('font-size','16px');
   $('li:not(:has(ul))').css({'list-style':'none','cursor':'default'});
})
почему если в 4 строчке написать $(this) то не работает?в чем разница

и еще в чем разница между
Javascript
1
.click(function(){})
и
Javascript
1
.bind('click', function(){})
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
02.04.2012, 15:39
Ответы с готовыми решениями:

Разница.
Добрый вечер, господа. Речь пойдет об объявлении функции. Кто нибудь может мне объяснить в чем...

разница like =
почему это запрос возвращает такие вот строки select * from users where login like 'M_A_S' M-A-S...

разница с и с++
с этого сема у нас в универе начинается с.одни говорят что с и с++ тоже самое другие что нет. хотел...

разница
Доброе время суток, я не давно начал изучать С++. Есть разница писать на eclipse и писать на visual...

20
13208 / 6596 / 1041
Регистрация: 10.01.2008
Сообщений: 15,069
02.04.2012, 19:18 2
this в данном примере (внутри функции на строке 3) сожержит элемент, на котором произошел click. Т.е. непосредственно элемент. А $(this) - это уже объект jQuery, который содержит тот элемент, на который кликнули. Если на пальцах, то this - конфета без фантика, а $(this) - это коробка с одной конфетой.
Цитата Сообщение от fireridlle Посмотреть сообщение
и еще в чем разница между
.click(function) - это сокращение для .bind('click', function) . Т.е. разницы нет.
2
75 / 75 / 13
Регистрация: 02.02.2012
Сообщений: 462
02.04.2012, 20:08  [ТС] 3
то есть в принципе можно везде использовать this. или методы jquery работают только если элемент обернут в $(this)?
0
weboman
210 / 195 / 63
Регистрация: 13.08.2010
Сообщений: 1,531
Записей в блоге: 6
04.04.2012, 03:32 4
Цитата Сообщение от fireridlle Посмотреть сообщение
или методы jquery работают только если элемент обернут в $(this)?
нет, методы jQuery работают и в таком варианте:
HTML5
1
<div class='my'></div>
Javascript
1
2
3
4
var _this = $('.my');
// в чистом js нельзя использовать this как переменную
 _this.text('А не послать ли нам гонца?');
только в js'ом ООП переменная this является объектом, вот пример:
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// функция скажи имя друга
function findFriend(user){
   
   // а это можно было бы даже сделать как метод, но пока не хочу так далеко заходить, а то вы запутаетесь
    switch(user){
        case 'Vasia': this.friend = 'Stas'; break;
        case 'Andrey': this.friend = 'Alex'; break;
        default: this.friend = 'no friends'; break;            
    }
    
    // это возвратит свойство объекта
    return this.friend ;
}
 
// попробуйте ввести напр. Vasia или какое-нть другое имя
alert(findFriend('Andrey'));
Цитата Сообщение от Vovan-VE Посмотреть сообщение
.click(function) - это сокращение для .bind('click', function) . Т.е. разницы нет.
это потом аукнется ему, разница есть, просто нужно знать когда и что применить, и п.с. лучше пользоваться on

Добавлено через 51 секунду
Цитата Сообщение от AlienNation Посмотреть сообщение
​​ & # 8 2 0 3 ;
а вот это мне уже надоело, эт шо?
1
75 / 75 / 13
Регистрация: 02.02.2012
Сообщений: 462
04.04.2012, 11:15  [ТС] 5
вроде бы onclick это событие в js а click в jquery.
хорошо если есть разница .click(function) и .hover('click', function) то какая?
0
weboman
210 / 195 / 63
Регистрация: 13.08.2010
Сообщений: 1,531
Записей в блоге: 6
04.04.2012, 16:28 6
Цитата Сообщение от fireridlle Посмотреть сообщение
.hover('click', function)
где вы такое нашли?

Добавлено через 1 минуту
Цитата Сообщение от fireridlle Посмотреть сообщение
вроде бы onclick это событие в js а click в jquery.
это верно
0
75 / 75 / 13
Регистрация: 02.02.2012
Сообщений: 462
04.04.2012, 17:21  [ТС] 7
в смысле .bind('click', function) )))
0
weboman
210 / 195 / 63
Регистрация: 13.08.2010
Сообщений: 1,531
Записей в блоге: 6
04.04.2012, 17:28 8
если элементы изначально сформированы в DOM-модели сайта, то логично использовать просто
Javascript
1
$('#element').click(function);
если же их формирует сценарий уже после того как DOM-модель загружена, то используется
Javascript
1
$('#element').bind('click',function);
иначе просто функция не сработает.
1
13208 / 6596 / 1041
Регистрация: 10.01.2008
Сообщений: 15,069
04.04.2012, 18:46 9
Цитата Сообщение от AlienNation Посмотреть сообщение
иначе просто функция не сработает.
Это одно и то же. Нет никакой разницы. Если правильно используете, то оба варианта будут работать одинаково в любом случае.
0
weboman
210 / 195 / 63
Регистрация: 13.08.2010
Сообщений: 1,531
Записей в блоге: 6
04.04.2012, 18:51 10
да пожалуйста, пусть везде использует
Javascript
1
$('#element').click(function);
зачем этот bind('click', вообще, только печатать больше...

p.s. я потом посмотрю на его темы на форуме с заголовком "почему функция не срабатывает при клике", я же сам через это проходил.

ну а конечно сам факт того, что кто-то почему-то кликнет это да, никакой разницы.
0
13208 / 6596 / 1041
Регистрация: 10.01.2008
Сообщений: 15,069
04.04.2012, 19:14 11
Цитата Сообщение от AlienNation Посмотреть сообщение
я потом посмотрю на его темы на форуме с заголовком "почему функция не срабатывает при клике", я же сам через это проходил.
Код в студию.
Цитата Сообщение от AlienNation Посмотреть сообщение
зачем этот bind('click', вообще, только печатать больше...
Да, именно так. Если используется unbind('click', f) , то вот тогда, имхо, имеет смысл импользовать bind('click', f) для симметрии, так сказать.
0
weboman
210 / 195 / 63
Регистрация: 13.08.2010
Сообщений: 1,531
Записей в блоге: 6
05.04.2012, 17:14 12
ЗЫ.. видимо я bind с live спутал, интересно что в ходе своих экспериментов выяснил что on ни всегда срабатывает на элементах, принятых из сценария после того как изначально DOM-дерево загрузилось. Если это мой баг, тогда я код выложу, если же так и должно быть, то вопрос закрыт!
0
13208 / 6596 / 1041
Регистрация: 10.01.2008
Сообщений: 15,069
05.04.2012, 18:55 13
Цитата Сообщение от AlienNation Посмотреть сообщение
выяснил что on ни всегда срабатывает на элементах, принятых из сценария после того как изначально DOM-дерево загрузилось. Если это мой баг, тогда я код выложу
Не тому назначаете? Надо назначать кому-то для кого-то. Чтобы всё работало правильно, первый из них всегда должен быть и никуда не деваться (body в крайнем случае).
0
weboman
210 / 195 / 63
Регистрация: 13.08.2010
Сообщений: 1,531
Записей в блоге: 6
05.04.2012, 19:06 14
изначально было
Javascript
1
2
3
4
$('a.test').live('click',function(){
// тут ajax, который добавляет такую же ссылку в DOM методом append
alert('Сработало');
}
все работало, т.е. та ссылка которая добавилась тоже являлась кликабельной и алерт выскакивал,
попробовал вместо live написать bind и on, ни то, ни другое не сработало.

Цитата Сообщение от Vovan-VE Посмотреть сообщение
кому-то для кого-то.
вы это

Javascript
1
$('div a.test').on('click',function(){
имеете в виду (не сработало)?
0
13208 / 6596 / 1041
Регистрация: 10.01.2008
Сообщений: 15,069
05.04.2012, 19:39 15
Цитата Сообщение от AlienNation Посмотреть сообщение
Javascript
1
$('div a.test').on('click',function(){
Этим Вы берёте всех a.test (которые находятся внутри div), которые были на данный момент времени, и им (только тем, кто есть на этот момент времени) каждому персонально вешаете обработчик. Любые другие a.test, которые будут появляться, даже и не в курсе о Ваших коварных замыслах. Вы сделали почти то же самое, что делает bind().

Надо назначать не им всем и каждому, а некоему их предку(-ам) который всегда был на странице, есть, и никуда не денется (например, какой-нибудь #content или body в крайнем случае) и ему вешать обработчик:
Javascript
1
$('#content').on('click', 'div a.test', function(){
Обработчик вешается (в данном примере) один единственный раз и навсегда на #content. При срабатывании физического click'а где-либо внутри #content кликнутый элемент проверяется с указанным селектором, и Ваш обработчик срабатывает только тогда, когда кликнутый элемент попадает под этот селектор. Теперь вообще не важно, были ли там внутри a.test, будут ли они добавлены/удалены. Им самим совершенно все равно. За все отвечает родитель #content.
0
weboman
210 / 195 / 63
Регистрация: 13.08.2010
Сообщений: 1,531
Записей в блоге: 6
05.04.2012, 20:21 16
Ваша логика совершенна правильна и понятна, я "въехал" и "испытал", но все же, постольку поскольку добиться положительного результата не вышло, выкладываю код:

HTML5
1
2
3
4
5
6
7
<div id="content">
    <div>
        <a href="#" class="test">ссылка с простым кликом, без <b>bind</b> (кликни меня)</a>
    </div>
    <hr>
    <div class="added"></div>
</div>
файл doit.php

PHP
1
2
3
<?php
echo "‹a href='#bottom' class='test'›эта ссылка прибыла из сценария (кликни)‹/a›";
?>
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
// вариант с простым кликом без bind
         $('a.test').click(function(){
                 
             $.ajax({
                url: 'doit.php',
                type: 'post',
                success: function(data){ 
                    alert('Сработало!');
                    $('.added').append(data);
                }        
             });
             
            return false;
         });
вот тут простор действий, я пробовал bind, пробовал live, on и так как вы сказали в последнем посте, через #content и даже через body, но по факту, срабатывает только live.
0
13208 / 6596 / 1041
Регистрация: 10.01.2008
Сообщений: 15,069
05.04.2012, 20:27 17
HTML5
1
2
3
4
5
6
7
<div id="content">
    <div>
        <a href="#" class="test">(кликни меня)</a>
    </div>
    <hr>
    <div class="added"></div>
</div>
Javascript
1
2
3
4
5
6
7
8
9
10
$(function(){
    $('#content').on('click', 'a.test', function(){
        $('.added').append(
            $('<a/>')
                .attr('href', '#')
                .addClass('test')
                .text('[или меня]')
        );
    });
});
http://jsfiddle.net/aTHtn/
1
weboman
210 / 195 / 63
Регистрация: 13.08.2010
Сообщений: 1,531
Записей в блоге: 6
05.04.2012, 21:42 18
Vovan-VE,
я идиот невнимательный, извиняюсь что базар такой развели, у меня ошибка была
Javascript
1
on/bind('click','a.test'function()
# Uncaught SyntaxError: Unexpected token function
все это время, что ж меня раньше-то не потянуло глянуть что в консоли творится, но худо-бедно истина такова: действительно если умно распорядиться назначением события, то можно обойтись без bind/on или даже live.
0
13208 / 6596 / 1041
Регистрация: 10.01.2008
Сообщений: 15,069
06.04.2012, 14:15 19
Цитата Сообщение от AlienNation Посмотреть сообщение
то можно обойтись без bind/on или даже live
live() давно стал deprecated в силу delegate() и on().
1
545 / 344 / 12
Регистрация: 05.11.2010
Сообщений: 1,076
Записей в блоге: 1
06.04.2012, 22:17 20
Если на пальцах, то this - конфета без фантика, а $(this) - это коробка с одной конфетой.
Может все-таки this это конфета, а $(this) это конфета в обертке?)
Вполне соответствует переводу wrapper class'a :-)
live() давно стал deprecated в силу delegate() и on().
Да, все эти методы теперь реализованы на основе on() и delegate():
Javascript
1
2
3
    bind: function( types, data, fn ) {
        return this.on( types, null, data, fn );
    },
2
06.04.2012, 22:17
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
06.04.2012, 22:17
Помогаю со студенческими работами здесь

Разница?
Два разных цикла. В одном цикле поставлена точка с запятой, а в другом нет. for i:=1 to 99 do...

Разница
Ситуация следующая: занимался продвижением сайтов которые написаны на html. поступил заказ...

разница
static int ar1 = { 1, 3 ,5 ,7, 9}; static int ar2 = {1,3,5,7,9 }; есть разница?

разница
как отнять от функции структуру ?


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
20
Ответ Создать тему
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2024, CyberForum.ru