Вход

Просмотр полной версии : closest(). Как найти элемент в толпе?


Viper
17.08.2010, 11:46
Ломаю стену 3й час... Никак не могу понят одного...
Есть код:

<div class="parent">
<div class="item">
<div class="folder">
<div class="result">&nbsp;</div>
...
<img ... />
<a class="add"><img ... /></a>
...
</div>
</div>
<div class="item">
...
</div>

и некий скрипт:
$("a#add").click(function(e){
e.preventDefault();
$.ajax({
url: $(this).attr("href"),
success: function(data) {
$(this).closest(".result").text(data);
}
});
});

Почему в div.result не выводится текст?
Если указать жестко селектор, то выводится у первого div.result из списка(а их в списке n).

exec
17.08.2010, 11:50
.result не является родителем #add

PeaceCoder
17.08.2010, 12:51
не $("a#add")
а
$("a.add")
класс и id разные вещи

Viper
17.08.2010, 13:57
PeaceCoder опечатался в коде.

exec,
натолкнули на мыслю :)

$(this).closest("div").prev().fadeOut(); как-то так

e1f
17.08.2010, 14:21
$("a#add").click(function(e){
var that = $(e.target).closest('a');
e.preventDefault();
$.ajax({
url: $(this).attr("href"),
success: function(data) {
*!*
//$(this).closest(".result").text(data);
*/!*
$(that).closest(".result").text(data);
}
});
});

А чем здесь является this, товарищи? Скорее всего XHR.

Viper
17.08.2010, 15:35
e1f да вы правы. часть $(that).closest(".result")... почему-то не сработала, а
$(that).closest("div").prev()... отработало как положено.

e1f
17.08.2010, 15:42
Тьфу, у вас разметка табами сбита, не увидел, что a не в result.
Не почему-то не сработала, а так и надо.

Андрей38
22.11.2011, 13:27
Товарищи-Гуру.
Подскажите пожайлуста.Вопрос на счет поиска парента.
Аж 3 варианта для:

<div >
<div ><p><img id='Nam'></p></div>
</div>

1
$('img').closest('div' )
2
$('img[id='Nam']').parent().parent('div' )
3
$('div:has(img[id='Nam])')
[I]ЧТО найдет этот парент имиджа БЫСТРЕЕ?
так как ВСЕ работают ОДИНАКОВО

ksa
22.11.2011, 13:59
Андрей38, предложу такой вариант... :)

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(document).ready(function() {
*!*
var o=$('#Nam').parents('div');
*/!*
alert(o.get(0).className);
});
</script>
</head>
<body>
<div >
<div class='test'>
<p><img id='Nam'></p>
</div>
</div>
</body>
</html>


Поскольку ты с атрибутами явно перемудрил... ;)

Андрей38
22.11.2011, 14:12
Спасибо КСА! Буду разбираться...
А ,кажеться этот ГЕТ тоже что и индекс?
А так_ на прямую_
$('div ').find('.test')
будет еще быстрее ?

ksa
22.11.2011, 14:17
А ,кажеться этот ГЕТ тоже что и индекс?
Нет. :no:
Вот почитай про них
http://jquery-docs.ru/core/get/
http://jquery-docs.ru/core/index/

ksa
22.11.2011, 14:19
1
$('img[id='Nam']').closest('div' )
2
$('img[id='Nam']').parent().parent('div' )
3
$('div:has(img[id='Nam])')
Приведу к более путёвому виду... :)

//1
$('#Nam').closest('div');
//2
$('#Nam').parent().parent('div');
//3
$('div:has(#Nam'));

Андрей38
22.11.2011, 14:22
Нет. :no:
Вот почитай про них
http://jquery-docs.ru/core/get/
http://jquery-docs.ru/core/index/

Спасибо,Гуру за ВСЕ!
.... Обращается непосредственно к конкретному элементу массива по его индексу.
Позволяет Вам извлечь конкретный элемент DOM и работать над ним напрямую без использования jQuery.
СУПЕР!
Огромное Спасибо ,КСА!

Андрей38
22.11.2011, 14:29
Приведу к более путёвому виду... :)

//1
$('#Nam').closest('div');
//2
$('#Nam').parent().parent('div');
//3
$('div:has(#Nam'));

...А вот эти самые [id='xxxx'] дают возможность впихивать туда вары:)
Поэтому я их и предпочитаю
реально у меня там стоят #Nam_1.... #Nam_22
...че-то варнутый ГЕТ толькой тестит в алерте , а на ДОМ не влияет никак в отличии от варнутых .parent('div') на Квери

ksa
22.11.2011, 16:44
А вот эти самые [id='xxxx'] дают возможность впихивать туда вары
А тут что мешает? :)


var i=5;
//1
$('#Nam_'+i).closest('div');
//2
$('#Nam_'+i).parent().parent('div');
//3
$('div:has(#Nam_'+i));

ksa
22.11.2011, 16:46
че-то варнутый ГЕТ толькой тестит в алерте , а на ДОМ не влияет никак в отличии от варнутых .parent('div') на Квери
get() возвращает объект DOM, а не жиКвери...

Я его использовал дабы как-то показать, что таки нашел нужный тебе элемент... ;)

Андрей38
22.11.2011, 17:24
get() возвращает объект DOM, а не жиКвери...

Я его использовал дабы как-то показать, что таки нашел нужный тебе элемент... ;)

Cпасибо КСА. Я еще не до конца понимаю ,на каком этапе жиКвери перестает дружить с ДжЭс*ом
С ФОР-работает.С неймТег-тоже.С Ленгз--тоже...

Андрей38
22.11.2011, 17:28
А тут что мешает? :)


var i=5;
//1
$('#Nam_'+i).closest('div');
//2
$('#Nam_'+i).parent().parent('div');
//3
$('div:has(#Nam_'+i));


Спасибо,Гуру.Еще никогда так не делал,кажеться(или не обращал внимания?).Буду делать так по-умолчанию.Вразумительнее выглядит
...О! в квадратных скобках мож писать и доставать какие хош атрибуты,даже взятые из головы!Вот почему я скобки использую больше чем # или . !
Вот пример ...find('*[Gooru="KSA_'+01+'"]') :)