jQuery -> XML -> Array - динамически создаваемые кнопки и ссылки - PullRequest
Новая
       27

jQuery -> XML -> Array - динамически создаваемые кнопки и ссылки

0 голосов
/ 21 февраля 2011

Это или не просто, но нужна ваша помощь с этим:

Мне нужно динамически создавать кнопки и ссылки в jQuery. Загруженные из XML данные помещаются в массив и теперь:

Вы можете нажать на одну из кнопок "категория" "пользователи" и т. Д. он запускает функцию, которая должна сделать кнопку для каждой из категорий f.ex .: Давайте создадим функцию, которая будет запускаться этими кнопками: он будет искать XML с атрибутом categoryID, который содержит txt со словом «что-то ...», и добавит его в #tester: 

function clickedCat(cat){
      alert("test btn" + cat); // to check if function started
      // here just some script search 'cat' in XML etc...
    })
}

теперь функция должна запускаться динамически созданными кнопками f.ex.:

function showCatName(){
    $("#categories").html(" ");
    for(i=0;i<catArr.length;i++){
    qw = catIDArr[i];
    $("<div id='showCatName"+qw+"'></div>").html("<input id='showCatName"+qw+"' type='button' title='showCatName"+qw+"' value='showCatName"+qw+"' />")
                        .click(function(event){clickedCat(qw)}).appendTo("#categories");
    }
}

но кнопка, созданная здесь, имеет одинаковое значение для всех из них - последний загруженный qw ...

В: Как заставить его запомнить значение qw - разное для каждого btn? поэтому btn [0] запускает qw [0], btn [1] запускает qw [1] и т. д. *

Вторая вещь - такая же проблема, но мне нужно ввести это в ссылку html: 

function showCatName2(){
    $("#categories").html(" ");
    for(i=0;i<catArr.length;i++){
    qw2 = catIDArr[i];
    $("<div id='showCatName"+qw2+"'></div>")
    .html("<a href='#' onclick:clickedCat("+qw2+")> Test btn"+qw2+"</a>")
    .appendTo("#categories2");
    }
}

Онклик, похоже, совсем не работает ...

В1: Как заставить его работать, чтобы он динамически создавал кнопки, запускающие функцию с другим значением?

Q2: как и выше, но вместо кнопок мне нужно поместить его в ссылку

Заранее благодарю за помощь, Lucas

1 Ответ

0 голосов
/ 21 февраля 2011

У вас проблема с закрытием showCatName(). Когда вы говорите это: 

function(event){ clickedCat(qw) }

Вы связываете ссылку на qw для функции, но эта не оценивает qw. Переменная qw вычисляется при срабатывании обработчика щелчка, и значение qw будет таким же, как и при завершении цикла; все обработчики кликов будут иметь одно и то же значение qw, потому что все они имеют одну и ту же переменную. Обычное решение этой проблемы - заставить qw быть оцененным при построении обработчика кликов: 

function make_click(qw) {
    return function() { clickedCat(qw); };
}
// ...
function showCatName(){
    $("#categories").html(" ");
    for(i=0;i<catArr.length;i++) {
        qw = catIDArr[i];
        $("<div id='showCatName"+qw+"'></div>")
            .html("<input id='showCatName"+qw+"' type='button' title='showCatName"+qw+"' value='showCatName"+qw+"' />")
            .click(make_click(qw))
            .appendTo("#categories");
    }
}

Вместо make_click() вы можете использовать немедленно выполняемую встроенную функцию, но вышеприведенное, вероятно, яснее, если у вас возникли проблемы с замыканиями.

Ваш второй не работает, потому что onclick:clickedCat ничего не значит в HTML. Возможно, вы имели в виду onclick=clickedCat. При таком подходе вы, вероятно, столкнетесь с проблемами цитирования qw2.

...