Question

我是HTML和JavaScript的新手，我完全迷失了。

我正在尝试创建一个待办事项列表，其中输入添加到列表顶部，当单击列表中的项目时，它将被删除。

我试图避免使用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>

问题是，list_item onclick函数永远不会激活。为什么呢？

我提前就我提出问题的方式遇到的任何问题道歉。

Answer 1

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

使用onclick代替onClick ...

甚至更好......使用event listeners

动态创建列表项onclick

1 个答案: