base.js:62 Uncaught TypeError: Cannot read property 'content' of null

来源:4-3 添加及查看Task(3)

马_贝er

2017-06-27

为什么这里.content会是空。分析不出来。。。跪求大腿。

;(function(){

var $form_add_task=$('.add-task'),

task_list=[];





init();


$form_add_task.on('submit',function(e){

var new_task={},$input;

//禁用默认行为

e.preventDefault();

//获取搜索框内的值

$input=$(this).find("input[name=content]");

new_task.content=$input.val(); console.log(new_task);

//值为空,返回

if(!new_task.content) return;

//存入新task_list

if(add_task(new_task)){

render_task_list();

$input.val(null);

}

})




function add_task(new_task){

//新写的推入task_list

task_list.push(new_task);

//更新store 

store.set(task_list);

return true;

}


function init(){

task_list = store.get('task_list')||[];

if(task_list.length)

render_task_list();

}




function render_task_list(){

var $task_list=$('.task_list'); console.log('$task_list',$task_list);


$task_list.html('');

for(var i=0;i<task_list.length;i++){

var $task=render_task_tpl(task_list[i]);

$task_list.append($task);

}

}



function render_task_tpl(data){

var list_item_tpl=

                "<div class='task-item'>"+ 

           "<span><input type='checkbox'></span>"+

           "<span class='task-content'>"+ data.content +"</span>"+

           "<span class='fr'>"+

           "<span class='action delete'> 删除 </span>"+

           "<span class='action detail'> 详细 </span>"+

           "<span>"+

           "</div>";

        return $(list_item_tpl);

}




})();


写回答

1回答

煦八羽

2017-07-17

 render_task_list() 的函数定义里,你写的var $task_list=$('.task_list'); 检查一下html文件里的类名是task_list还是task-list,很有可能是“写错查找的类”这个原因导致没有成功添加新task。


另外建议在render_task_tpl()函数定义的第一行添加  if (!data)  return; 语句

0
0

6小时 jQuery开发一个前端应用

搭建一个清单应用,一次性掌握jQuery核心功能和使用技巧

1219 学习 · 161 问题

查看课程