Как использовать $ (this) для динамического получения атрибута title тега привязки

Question

Я пытаюсь разработать систему тегов для моего сайта.

У меня есть привязанный тег, окружающий мой тег div, который имеет название для него. Я пытаюсь использовать следующие коды для получения заголовка, но результат всегда не определен.

<a href="#" class="add-link" onclick="addFunc()" title="test1"> 
    <div class="divclass"> 
     blabla  
    </div> 
</a> 

function addFunc(){ 
    var username = $(this).attr('title'); 
    $('#content').html(username); 
} 

http://jsfiddle.net/0f4mun8r/3/

любая идея, почему?

спасибо!

Answer 1

Вы не включили jquery в свою скрипку. Кроме того, если вы используете JQuery связать свои события с ним, как это:

$(".add-link").on("click", function addFunc(){ 
    var username = $(this).attr('title'); 
    $('#content').html(username); 
}); 

http://jsfiddle.net/0f4mun8r/4/

Answer 2

У вас есть три проблемы.

---

Первое:

Вы настроили JS скрипку, чтобы обернуть весь код в обработчик OnLoad. Это останавливает функцию глобальной, поэтому, когда вы вызываете addFunc, ее невозможно найти.

---

Второе:

Вы звоните JQuery, но не входит в библиотеку JQuery.

---

Третье:

Значение this зависит от того, как вызвать функцию.

Когда вызывается функция onclick, элемент this.

Когда вызывается addFunc (если вы исправите другие проблемы), поскольку вы не указали контекст, this - это window (объект по умолчанию).

---

Не используйте внутренние атрибуты событий. Свяжите обработчики событий с JavaScript.

jQuery(".add-link").on('click', addFunc); 

И если вы используете JQuery, то include the library на вашей странице.

Answer 3

пытаются называть его имени класса:

$('.add-link').click(function() { 
    var username = $(this).attr('title'); 
    alert(username); 
    $('#content').html(username); 
});