Функция щелчка работает только на моем первом элементе в моем ретрансляторе, почему?

Question

Вот моя разметка:

<a href="#" id="buyMobileTickets" class="btn blue" data-ivaid="<%# ((MovieModel)Container.DataItem).FID %>">Buy Ticket(s)</a> 

здесь является JQuery в documentReady

$(document).ready(function() { 
$("#buyMobileTickets").on("click", mobileTickets); 
}); 

вот моя функция:

function mobileTickets(e, ui) {  
     var ivaId = $(this).attr("data-ivaid"); 
     var theatre = Regal.userPrimaryTheatre; 
     var movietDt = new Date(); 

     window.open("http://www.fandango.com/redirect.aspx?&a=12878&dte=0&mid=" + ivaId + "&tid=" + theatre , "_blank"); 

    } 

Это работает только для первого элемента данных в моем повторителя , Что я делаю не так?

Answer 1

Поскольку в HTML не должно быть элементов с одинаковым идентификатором. В документе всегда может быть один элемент с определенным идентификатором.

Вы должны использовать класс вместо:

<a href="#" class="buyMobileTickets btn blue" ...>Buy Ticket(s)</a> 

, а затем селектор класса с JQuery:

$(".buyMobileTickets").on("click", mobileTickets);