TO DO LIST
358
投稿した質問数 9
- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요!
- 먼저 유사한 질문이 있었는지 검색해보세요.
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
무슨 실수를 했는지 한번 확인해주실수 있을까요??ㅜㅜ
let taskInput = document.getElementById('task-input'); let addButton = document.getElementById('add-button'); let tabs = document.querySelectorAll('.task-tabs div'); let taskList = []; let mode = 'all'; let filterList = []; addButton.addEventListener('click', addTask); for (let i = 1; i < tabs.length; i++) { tabs[i].addEventListener('click', function (event) { filter(event); }); } function addTask() { let task = { id: randomIdGenerate(), taskContent: taskInput.value, isComplete: false, }; taskList.push(task); render(); } function render() { let list = []; if (mode == 'all') { list = taskList; } else if (mode == 'ongoing' || mode == 'done') { list = filterList; } } let resultHTML = ''; let list = []; for (let i = 0; i < list.length; i++) { if (list[i].isComplete == true) { resultHTML += `<div class="task" id="${list[i].id}"> <div class ="task-done">${list[i].taskContent}</div> <div> <button onclick="toggleComplete('${list[i].id}')">Check</button> <button onclick="deleteTask('${list[i].id}')">Delete</button> </div> </div>`; } else { resultHTML += `<div class="task" id="${list[i].id}"> <div>${list[i].taskContent}</div> <div> <button onclick="toggleComplete('${list[i].id}')">Check</button> <button onclick="deleteTask('${list[i].id}')">Delete</button> </div> </div>`; } } document.getElementById('task-board').innerHTML = resultHTML; function toggleComplete(id) { for (let i = 0; i < taskList.length; i++) { if (taskList[i].id == id) { taskList[i].isComplete = !taskList[i].isComplete; break; } } render(); console.log(taskList); } function filter(event) { mode = event.target.id; let filterList = []; if (mode == 'all') { render(); } else if (mode == 'ongoing') { for (let i = 0; i < taskList.length; i++) { if (taskList[i].isComplete == false) { filterList.push(taskList[i]); } } render(); } else if (mode == 'done') { for (let i = 0; i < taskList.length; i++) { if (taskList[i].isComplete == true) { filterList.push(taskList[i]); } } render(); } } console.log(filterList); function randomIdGenerate() { return (performance.now().toString(36) + Math.random().toString(36)).replace( /\./g, '' ); } function deleteTask(id) { for (let i = 0; i < taskList.length; i++) { if (taskList[i].id == id) { taskList.splice(i, 1); break; } } render(); }
回答 1
0
안녕하세요
어떤 에러가 났는지 에러메세지와 코드를 읽기쉽게 정리해서 올려주시면 감사하겠습니다 글작성시 상단 툴바에 </> 이렇게 생긴 코드를 선택하시면 코드 보이는 그대로 붙여넣기해서 올려주실 수 있습니다!
반복문 문제3 369게임
0
463
1
투두리스트 과제 힌트 좀 주세요 ㅠ
0
389
1
강의가 재생이 안됩니다.
0
417
2
강의 정리된 자료
0
410
1
타임즈뉴스 401에러
0
355
1
to do list
0
319
1
EventListener 질문입니다.
0
266
1
developer tool 아이콘 클릭했는데 콘솔창이 안떠요
0
254
1
git 허브나 netlify 용량
0
1250
1
깃허브 오류
0
366
1
Math 함수를 사용해봤는데. ... 은 무슨 의미일까요??
0
429
1
로컬스토리지 저장하는 방법 알려주세요 ㅠㅠ
0
862
1
타임즈 render 부분 질문
0
433
1
인프런 블로그 작성
1
488
1
전날엔 되던것이 담날엔 안되네요 ㅜㅜ
0
426
1
뉴욕타임즈 뉴스를 그려보자 reder편 질문
0
396
1
TO DO LIST
0
435
1
es6 7번 문제에 관하여 질문사항 있습니다.
0
326
1
node.js 로 웹서버 구축할때 힘들었는데 넷리파이로 이렇게 쉽게 웹서버가 만들어지다니.. 감동입니다. 항상 서버도 살아있고 깃헙이랑 동기화되는게 장점인것같아요
0
415
0
함수강의 연습문제 6번 질문사항
0
254
1
let gameOver = false;
0
252
1
api 호출 관련해서 Usage 가 50이라...
0
413
1
map이 안먹습니다.. ㅠㅠㅠ
0
364
2
"Postman" 앱이 더 이상 지원되지 않습니다.
0
810
1

