Получение id элемента, родитель которого динамически меняет класс
Всем доброго! Подскажите, плиз:
Есть таблица:
<table class="interface">
<tr class="any over">
<td><a class="element" id="123">ссылка 1</a></td>
</tr>
<tr class="any">
<td><a class="element" id="234">ссылка 2</a></td>
</tr>
<tr class="any">
<td><a class="element" id="345">ссылка 3</a></td>
</tr>
Я хочу вывести при наведении на ссылку подсказку с помощью qTip. Для этого:
$(document).ready(function(){
$('.element').qtip({
content: {
text: 'Подождите...',
ajax: {
url: 'ajax.php?ELEMENT_ID='+$('.interface').find('.over').children('.element').attr('id')
}
}
});
});
Класс over устанавливается динамически при наведении мышкой на строку. Хочется, чтобы при наведении мышкой на ссылку скрипт вытаскивал id этой ссылки из подсвеченной строки. Но в таком виде скрипт не работает, не находит over... Пробовал так
$(document).ready(function(){
$('.element').qtip({
content: {
text: 'Подождите...',
ajax: {
url: 'ajax.php?ELEMENT_ID='+$(this).attr('id')
}
}
});
});
Но в this, естественно, хранится window, а не ссылка на нужный объект |
$('.interface .over .element').attr('id');
|
Пробовал, не видит over. Соответственно, возвращает undefined
|
должен видеть попробуй вывести алертом:
alert($('.interface .over .element')[0].innerHTML); // должен вывести имя ссылки, в противном случае что-то у тебя не так.
|
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<table class="interface">
<tr class="any over">
<td><a class="element" id="123">ссылка 1</a></td>
</tr>
<tr class="any">
<td><a class="element" id="234">ссылка 2</a></td>
</tr>
</table>
<script type="text/javascript">
alert($('.interface .over .element')[0].innerHTML);
</script>
|
запусти то что я прислал, увидешь что покажет в алерте "ссылка 1"
|
У меня чуть другая ситуация: на момент формирования страницы нет элемента с over.
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<table class="interface">
<tr class="any">
<td><a class="element" id="123">ссылка 1</a></td>
</tr>
<tr class="any">
<td><a class="element" id="234">ссылка 2</a></td>
</tr>
</table>
<script>
$(document).ready(function(){
$('.any').hover(
function() {
$(this).addClass('over');
},
function() {
$(this).removeClass('over');
}
);
$('.element').qtip({
content: {
text: 'Подождите...',
ajax: {
url: 'ajax.php?ELEMENT_ID='+$('.interface .over .element').attr('id');
}
}
});
});
</script>
А твой код работает - не спорю, посмотрел:) |
Ну значит класс к элементу не применяется, и ты пытаешься загрузить до того как класс был назначен.
|
Вот я примерно это и имел в виду: скрипт не видит over из-за того, что класс назначается динамически.
А второй вопрос: можно ли как-то сослаться на объект, к которому привязывается qTip? Что-то типа:
$(document).ready(function(){
$('.element').qtip({
content: {
text: 'Подождите...',
ajax: {
url: 'ajax.php?ELEMENT_ID='+$(this).attr('id')
}
}
});
});
|
Это надо документацию читать по этому плагину
|
| Часовой пояс GMT +3, время: 22:12. |