2009-10-12 2 views
1

Я создаю небольшую динамическую подсказку.Почему мой селектор jquery не работает здесь?

В принципе, если у меня есть ссылка, как так:

<a href="#" data="xyz">?</a> 

Использования QTIP, я пытаюсь для поиска таблицы подсказки в MySQL и извлечь наконечник на основе данных в атрибуте данных.

Итак:

$('a[data]').qtip({ 
    content: { 
     url: '/tooltip.php', 
     data: { tipKey: $(this).attr('data') }, 
     method: 'post' 
} 
}); 

Проблема заключается в том, что не работает. $ (this) .attr ('data'), похоже, не вытягивает значение внутри атрибута.

Если я вручную изменю функцию, чтобы она выглядела следующим образом, она не работает.

$('a[data]').qtip({ 
    content: { 
     url: '/tooltip.php', 
     data: { tipKey: 'xyz' }, 
     method: 'post' 
    } 

}); 

Что мне не хватает, когда я пытаюсь извлечь данные из атрибута данных? Должен ли я делать что-то вроде:

$('a[data]').qtip({ 
    content: { 
     url: '/tooltip.php', 
     data: { tipKey: ''+$(this).attr('data')+'' }, 
     method: 'post' 
    } 

}); 

Так как это не дает значения!

ответ

4

Ваш код не работает, потому что ключевое слово this представляет контекст выполняемой функции, и вы используете его внутри объектного литерала.

Например, если вы выполняете свой фрагмент в событии $(document).ready, ключевое слово this будет представлять элемент документа.

Вы можете iterate над селектором и инициализировать каждый элемент в отдельности подсказку:

$('a[data]').each(function() { 
    var $link = $(this); 
    $link.qtip({ 
     content: { 
     url: '/tooltip.php', 
     data: { tipKey: $link.attr('data') }, 
     method: 'post' 
     } 
    }); 
}); 

также отметить, что атрибут data не является стандартным, ваша страница не будет проходить W3C Validator.

+0

спасибо кучи CMS ... я перешел от «данных» к «title», и ваше решение сработало. – willdanceforfun

1

Этот пример работает для меня:

<html> 
<head> 
<title>Text</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$(function() { 
    alert($("a[data]").text()); 
}); 
</script> 
</head> 
<body> 
<a href="#" data="123">abc</a> 
</body> 
</html> 
+2

Ну, он ищет атрибут, а не текст ссылки? – AlbertoPL

+0

Исправить Alberto ... не attr не материал между willdanceforfun

1

Вы должны попытаться получить доступ к элементу 0-й данных. Вот так:

data: { tipKey: $("a[data]")[0].data}, 

EDIT: О, хорошо, я вижу, это должно работать тогда как альтернатива.

+0

hmmm ... я надеялся, что это сработает, но это не так: | – willdanceforfun

Смежные вопросы