Сделать div, clickable в javascript

Question

Я пытаюсь динамически сделать divs, которые можно щелкнуть. Я вставил тестовую функцию. Функция тестирования работает даже при том, что div не был нажат. Спасибо за любую помощь.

function displayResults(responseTxt) 
    { 
     var results = document.getElementById("results"); 
     jsonObj = eval ("(" + responseTxt + ")"); 
     var length = jsonObj.response.artists.length; 
     results.innerHTML = "Please click on an artist for more details: " 

     for (var i = 0; i < length; i++) 
     { 
      var entry = document.createElement("div"); 
      var field = document.createElement("fieldset"); 

      entry.id = i; 
      entry.innerHTML = i + 1 + ". " + jsonObj.response.artists[i].name; 
      field.appendChild(entry); 
      results.appendChild(field); 
      //entry.addEventListener("click", idSearch(jsonObj.response.artists[i].id), false); 
      entry.addEventListener("click", test(), false); 

     } 
    } // end function displayResults   

    function test() 
    { 
     document.getElementById("results").innerHTML = "tested"; 
    } 

Answer 1

Вы вызываете функцию test() и передавая ее возвращаемое значение .addEventListener(). Удалить скобки:

entry.addEventListener("click", test, false); 

Так что вы передаете саму функцию .addEventListener().

Это отвечает на вопрос, как просил, но предвидеть вашу следующую проблему, для линии вы получили закомментированную вы могли бы сделать это:

entry.addEventListener("click", 
         function() { 
          idSearch(jsonObj.response.artists[i].id); 
         }, false); 

То есть, создать анонимную функцию, чтобы перейти на .addEventListener(), где анонимная функция знает, как вызвать функцию idSearch() с параметрами. За исключением того, что это не сработает, потому что когда событие действительно вызвано, i будет иметь значение от конца цикла. Вам нужно добавить дополнительную функцию/закрытие, так что отдельные значения i доступны:

for (var i = 0; i < length; i++) 
    {   
     var entry = document.createElement("div"); 
     var field = document.createElement("fieldset"); 

     entry.id = i; 
     entry.innerHTML = i + 1 + ". " + jsonObj.response.artists[i].name; 
     field.appendChild(entry); 
     results.appendChild(field); 
     // add immediately-invoked anonymous function here: 
     (function(i) { 
      entry.addEventListener("click", 
           function() { 
            idSearch(jsonObj.response.artists[i].id); 
           }, false); 
     })(i); 
    } 

Это способ, i в jsonObj.response.artists[i].id на самом деле будет параметром i из анонимной функции, которая является индивидуальным значением i из цикла во время каждой итерации.