HTML <datalist>로 자동 제안 기능 구현 정보
HTML <datalist>로 자동 제안 기능 구현
본문
자동완성 기능은 종종 라이브러리나 사용자 정의 JavaScript로 수행됩니다. 하지만 HTML의 <datalist> 요소를 사용하면 최소한의 노력으로 자동 제안 입력을 만들 수 있습니다.
HTML :
<input type="text" list="suggestions" placeholder="선택하세요...">
<datalist id="suggestions">
<option value="웹학교">
<option value="영카트 다국어">
<option value="구인구직 솔루션">
</datalist>
CSS :
.container {
width: 300px;
display: block;
}
input {
padding: 10px;
font-size: 18px;
width: 100%;
box-sizing: border-box;
}
By 웹학교
추천
2
2
댓글 2개
감사 합니다.
@들레아빠 ^-^
