Функция onclick в l oop, выполняется без нажатия - PullRequest
1 голос
/ 30 марта 2020

Я получаю данные из API Blizzard (работает нормально), и у меня есть jquery $ каждый л oop для извлечения данных, которые я затем добавляю в ul. Я хочу добавить кнопку в каждый раз, когда l oop выдает данные для объекта. проблема в том, что когда я использую onclick = '"+ myfunction (param) +"' внутри l oop, он выполнит функцию до того, как я нажму кнопку, к которой прикреплен onclick. когда я проверяю браузер, он говорит onclick = "undefined". вот код:

let tid;
function reply_click(clicked_id){
console.log(clicked_id);
}
$('#searchnow').bind('click',
function (){
function kaldapiclass(){
    // console.log("card");
    var classSelect=$('#thisclass').val();
    $.getJSON('https://us.api.blizzard.com/hearthstone/cards? 
locale=en_US&access_token=hidden&class='+classSelect, function(data) {
        $('#kortliste').empty();
        $.each( data.cards, function(i, card) {

            $()
            $('#kortliste').append("<li id='" + card.id + "'><img src='" + card.image + "'><p>"+ 
card.name +"</p><button onclick='"+reply_click(card.id)+"'>HERE</button></li>");
        });
    });
};
clearTimeout(tid);
tid=setTimeout(kaldapiclass, 500);

});

ты за свое время -Мортен

1 Ответ

0 голосов
/ 30 марта 2020

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

"<button onclick='"+reply_click(card.id)+"'>HERE</button>"

вам нужно просто определить элемент так, как вы бы поместили его в dom:

"<button onclick='reply_click("+card.id+")'>HERE</button>"

Только card.id должно быть динамическим c.

Я бы также предложил добавить html только один раз, таким образом:

var toAppend = '';
$.each( data.cards, function(i, card) {
    toAppend += "<li id='" + card.id + "'><img src='" + card.image + "'><p>" + card.name + "</p><button onclick='reply_click(" + card.id + ")'>HERE</button></li>";
});
$('#kortliste').html( toAppend );
...