2014-12-10 3 views
1

Я совершенно не знаком с HTML и JavaScript, и я полностью потерян.динамически созданный элемент списка onclick

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

Я стараюсь избегать использования JQuery или чего-либо вне чистого js.

<!DOCTYPE html> 
<html> 

<script type="text/JavaScript"> 

var number_of_items = 0; 
var list = []; 
var list_container = document.createElement("div"); 
list_container.id = "container"; 

function makelist(){ 
    list_container.innerHTML = ""; 

    list.unshift(document.getElementById("todo").value); 

    ++number_of_items; 

    document.getElementsByTagName("body")[0].appendChild(list_container); 
    var list_element = document.createElement("ul"); 
    list_container.appendChild(list_element); 

    for(var i=0 ; i < number_of_items ; ++i){ 
      var list_item = document.createElement("li"); 
       list_item.innerHTML = list[i]; 

      //The problem is here 
      list_item.onClick = function(){ 

       alert("working"); 
       list.splice(i, 1); 
       --number_of_items; 
       makelist(); 

      } 

      list_element.appendChild(list_item); 
    } 
} 

</script> 

<body> 
Todo: <input type="text" id="todo"> 

<input type="button" value="Submit" onclick="makelist()" /> 



</body> 
</html> 

Проблема в том, что функция onclick list_item никогда не активируется. Зачем?

Я заранее извиняюсь за любые проблемы с тем, как я изложил свой вопрос.

+0

Как вы знаете, что функция не 'активировать'? Вы получаете какие-либо ошибки? – putvande

+0

Ничего не происходит. Я поставил предупреждение в функцию, чтобы проверить его, и предупреждение никогда не появлялось. – DoctorMcbob

+0

Вы указали значение в своем поле ввода? В противном случае вы получите сообщение об ошибке. – putvande

ответ

3

http://jsbin.com/wicopu/1/edit

использование onclick вместо onClick ...

или даже лучше ... использовать event listeners

+1

в строке 'list_item.onClick = function() {' ... plz не уменьшайте то, что вы не понимаете. – rafaelcastrocouto

+1

Я задам этот вопрос и его ответ в своих избранных. Он показывает, как установить событие в чистом Javascript. – SaidbakR

+1

Спасибо! Весь мой опыт с кодом в python и java, поэтому я привык к тому, что закричал, когда проблема - пропущенная столица. Я должен был знать. – DoctorMcbob

Смежные вопросы