Javascript待办事项列表添加项目

时间:2016-07-10 20:51:15

标签: javascript html css debugging

我的JS代码存在问题的新编码。它在最近几天工作,然后我不确定发生了什么现在它给我一个错误就行(17)todos.push(任务);错误说" todos.push()不是一种功能。"任何帮助将不胜感激。

 function get_todos()
 {
 var todos = new Array;
 var todos_str = localStorage.getItem('todo');
 if (todos_str !== null) {
    todos = JSON.parse(todos_str);
 }
 return todos;
 }


function add()
{
var task = document.getElementById('task').value;

var todos = get_todos();
todos.push(task);
localStorage.setItem('todo', JSON.stringify(todos));

show();

return false;
}


function remove()
{
var id = this.getAttribute('id');
var todos = get_todos();
todos.splice(id, 1);
localStorage.setItem('todo', JSON.stringify(todos));

show();

return false;
}

function show()
{
var todos = get_todos();

var html = '<table>';
for(var i=0; i<todos.length; i++)
{
html += '<br><tr><strong>'+
'<input type="image" src="/Pictures/remove.png" class="remove"    id="' + i  +
'"></input>' + todos[i] + '</strong><input type="checkbox" name="cBox"   store="checkbox1"  id="isDone"><label for="cBox"</label></tr><br>';
};
html += '</table>';


document.getElementById('todos').innerHTML = html;

var buttons = document.getElementsByClassName('remove');
for (var i=0; i < buttons.length; i++)
{
    buttons[i].addEventListener('click', remove);
};
}

document.getElementById('add').addEventListener('click', add);
show();

我的HTML

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,   user-scalable=yes">
    </head>
    <body>
    <img id="mainImg"  src="\Pictures\mytodolist.jpg"
    <form>
    <div>
    <img  id="taskImg" src="\Pictures\tasks.jpg"
    <br>
    <br>
    <input  id="add" type="image" width='150' heigth='80'   src="\Pictures\addButton.png" ></input>
    <br>
    <input id="task">
    </div>
    <div id="todos"></div>

    <script src= "ToDo.js"></script>
    <link rel= "stylesheet" type= "text/css" href="todoStyle.css"/>
     </body>
    </html>

1 个答案:

答案 0 :(得分:0)

似乎在这里工作正常:http://codepen.io/ilanus/pen/xOXJXW您在Array函数中声明get_todos()将其退回,然后向其中添加项todos.push(task);

相关问题