2017-11-25 14 views
0

JavaScriptのTo-Doリストをビデオの後に繰り返しますが、ビデオは既に2年であるため、プロパティや変更されたものがある可能性があります。知りません。ここ はHTMLである:ここではevent.target in functionは機能しません

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>To-Do list</title> 
    <link rel="stylesheet" href="main.css"> 
</head> 
<body> 
    <input type="text" id="input"> 
    <button id="btn">Add</button> 

    <hr> 

    <ul id="todo"> 

    </ul> 
    <ul id="done"> 

    </ul> 




    <script src="main.js"></script> 
</body> 
</html> 

ではJavaScriptです:機能で

(function() { 
    let input = document.getElementById('input'); 
    let btn = document.getElementById('btn'); 
    let lists = { 
     todo: document.getElementById('todo'), 
     done: document.getElementById('done') 
    }; 

    let makeTaskHtml = function(str, onCheck) { 
     let el = document.createElement('li'); 
     let checkbox = document.createElement('input'); 
     let label = document.createElement('span'); 

     checkbox.type = 'checkbox'; 
     checkbox.addEventListener('click', onCheck); 
     label.textContent = str; 

     el.appendChild(checkbox); 
     el.appendChild(label); 

     return el; 
    }; 


    let addTask = function(list, task) { 
     list.appendChild(task); 
    }; 

    let onCheck = function(event) { 
     let task = event.target; 

     console.log(task); 
    }; 

    addTask(lists.todo, makeTaskHtml('Test-todo')); 
    addTask(lists.done, makeTaskHtml('Test-done')); 


}()); 

私は前にこの関数で定義されているが、何も起こらなかったタスクCONSOLE.LOGしようとしたoncheckを:エラーも結果Iもありません予想通りに表示されます 何が問題なのですか?それはevent.targetのためでしょうか?またはaddEventListener? 私にそれを明らかにする助けてください。あなたはmakeTaskHtml機能

答えて

1

事前に感謝は2つの引数とります

function makeTaskHtml(str, onCheck) 

をしかし、あなたは一つだけでそれを呼び出している:

addTask(lists.todo, makeTaskHtml('Test-todo')); 

は、あなたが2番目の引数としてonCheckに渡すか、削除する必要があります関数の宣言から2番目の引数。

+0

ありがとうございます!本当に助けになりました! –

関連する問題