loading

새소식
JS Library/React

[React] 리액트 검색용 해시태그 입력을 위한 사용자 편의 기능 추가하기

  • -
728x90
반응형
<body>
  검색어 입력 : <input type="text" name="search">

</body>
<script>
  const input = document.querySelector('[name=search]');
  input.addEventListener('focus', (event) => {
    let search = event.currentTarget.value;  // 선택한 타겟의 값
    if(search.length == 0) {
      event.target.value = '#';
    }
  });

  input.addEventListener('keyup', (event) => {
    let keyCode = event.keyCode;
    if(keyCode == 32) {
      let pressValue = event.target.value;
      pressValue = pressValue.substring(0, pressValue.length - 1);
      event.target.value = pressValue + ', #';
    }
    console.dir(event);
  });

</script>

 

728x90
반응형
Contents

추천 컨텐츠

  • -

    • 📝 포스팅 주소를 복사했습니다 📝

    이 글이 도움이 되었다면 공감 부탁드립니다👍

    SHARE

    MENU

    티스토리툴바