Frontend/HTML,CSS

만약 전화번호 입력 칸 같은 경우 010-0000-0000 2,3번째 input 태그 안에는 4글자 제한이 필요하다 라는 경우에 사용하는 게 input에 maxlength 속성이 있다. 아래와 같이 사용한다. 하지만 전화번호 같은 경우 숫자만와야하니 type을 Number 변경한다 이경우 maxlength가 작동되지 않고 제한을 넘어간다. type="Number"인 경우 maxlength를 사용할 수 없다 javascript로 처리하게 된다. function maxLength(object){ if (object.value.length > object.maxLength){ object.value = object.value.slice(0, object.maxLength); } }

태그는 요소에서 사용하기 위한 옵션들의 리스트를 미리 정의할 때 사용합니다. 옵션들은 자동완성 기능을 제공합니다. 태그와 태그는 datalist의 id와 input의 list로 연결시킵니다. autocomplete='off'는 datalist가 출력될 때 input에 브라우저에서 저장해둔 내용이 뜨는 걸 막습니다. 안에 태그로 값을 줄 수 있습니다. value 저는 DB에 저장되어있는 개발사와 유통사를 자동으로 제시해야 하기 때문에 script 단에서 DB에 있는 값을 option단위로 넣어줬다 DB에 값을 넣어줬다 입력한 글자에 맞춰서 자동완성이 된다 동일한 글자에 색상을 넣거나 DATALIST 출력 개수 제한 같은 건 찾아봐야 할 거 같다.