Notice
Recent Posts
Recent Comments
Link
250x250
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
Tags
- react
- JavaScript
- 자바스크립트
- javascript코딩테스트
- 블럭요소
- redux 사용방법
- Redux
- first-child
- useParams
- JSON
- db.json
- line-through
- React state
- 6주포트폴리오
- javascript React
- 카우치코딩
- foreach
- sort
- useEffect
- 인라인블럭
- react redux
- toString
- 콜백함수
- 협업프로젝트
- useSearchParams
- Redux store
- React onClick
- redux toolkit
- couchcoding
- 자바스크립트배포
Archives
- Today
- Total
개발하는 루루언니
html : onkeydown 내가 엔터를 누르면 이벤트가 실행 본문
728x90
반응형
ToDo
- 리엑트공부
- css 공부
HTML 코드
<input type="text"
id="todo-input"
onkeydown="KeyCodeCheck()"
/>
onkeydown을 input에 이벤트를 적용하고 실행할 자바스크립트 함수 KeyCodeCheck를 적용시킨다.
지금 콘솔로 해놔서 안보이지만 내가 글자를 적으면 해당 value값이 작용되면서 엔터를 누르면 이벤트가 실행된다.
const todoinput = document.querySelector('#todo-list')
// 인풋의 값들을 가져오는 함수
const KeyCodeCheck = function () {
if(window.event.keyCode === 13 ){
const inputValue = document.querySelector('#todo-input').value
const newLi = document.createElement('li')
const newsapn = document.createElement('span')
newsapn.textContent=inputValue
newLi.appendChild(newsapn)
console.log(newLi)
}
}
728x90
'컴퓨터 정보' 카테고리의 다른 글
netify : 도메인 이름 바꾸기 (0) | 2022.12.19 |
---|---|
면접질문 : API 란? (0) | 2022.11.26 |
내가 좋아하는 일러스트 (0) | 2022.11.19 |
cloudinary : REST API를 사용하여 이미지 업로드하기 (0) | 2022.11.14 |
비쥬얼 스튜디오 이모지 쓰는법 ☺ (0) | 2022.11.11 |