Невозможно связать событие click на кнопке с jquery

Question

Я новичок js.

У меня есть структура вроде этого:

<ul class='selectable-list'> 
<li><a data-id="5" data-type="Content">Test</a></li> 
<li><a data-id="3" data-type="Content">Test</a></li> 
</ul> 

добавить ан событие

$selectableList = $('.selectable-list a'); 
$selectableList.click(function(){ 
    console.log(this) 
    script.addItem(this); 
}); 

Результатом является то, что this является текст, так что я не могу получить данные атрибуты ... почему?

Edit:

 bindEvents : function bindEvents() { 
      $selectableList.click(function(){ 
       console.log(this.attr("data-type")) 
       script.addItem(this); 
      }); 
     } 

Uncaught TypeError: this.attr is not a function 

Answer 1

Я не уверен, где текст вы говорите откуда. this будет узлом DOM, на который вы нажали. Если вы завернете его в $(), вы сможете прочитать атрибут данных.

$selectableList = $('.selectable-list a'); 
 
$selectableList.click(function(){ 
 
    
 
    var anchor = $(this); 
 
    console.log(anchor.data("id"), anchor.data("type")); 
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul class='selectable-list'> 
 
<li><a data-id="5" data-type="Content">Test</a></li> 
 
<li><a data-id="3" data-type="Content">Test</a></li> 
 
</ul>

Answer 2

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

Здесь, в фрагменте кода, который вы пытаетесь использовать на , этот который принадлежит к собственному javascript и не имеет связанного с ним метода .attr. Этот этот объект будет объектом узла DOM, на который вы нажали.

Что вам нужно сделать, это обернуть это что-то около $ или Jquery имен, как

$(this).attr("data-type") 

и вы должны быть хорошо идти

Надежда это быть какой-то помощи.

Happy Learning :)