iOS input focus, buffer

한글은 자음, 모음으로 구성된다. iOS에서 input 에 있는 value를 'X' 버튼 등으로 한번에 삭제하고 다시 input에 focus를 주려고 할 때,input에 입력되어 있던 문자가 한글이고, 마지막 문자가 받침이 없는 문자였다면,문자를 재입력 했을 때 남아있던 버퍼가 함께 보여지게 된다.'오늘날씨' 입력 후X 버튼 클릭응로 value 삭제input에 focus가 옮겨지고 '내일날씨'를 입력이런 경우에 input value에는 '내일날씨'가 입력되어 있는게 아니라, 남아있던 buffer로 인해 '씨내일날씨'가 입력되게 된다. 이 문제는, input에 focus를 주기 전, 다른 input을 생성해 그곳에 먼저 focus를 줬다가, 검색 input에 다시 focus를 줘서 buffer를 삭제해줘야..

2024.06.12

서버 없이 업로드한 이미지 다루기, createObjectURL()

보호되어 있는 글입니다.

2023.06.21

@input="", @change="", v-model

보호되어 있는 글입니다.

2023.06.16

state를 이용하여 input 입력값 가져오기

state와 onChange 함수를 활용해 사용자가 input에 입력 한 값을 바로 가져올 수 있다. react에서는 HTML을 직접 만질 필요가 없다. state를 변경하면 바로 반영되기 때문! function App (){ let [text, setText] = useState(''); return ( { setText(e.target.value) }} /> {text} ) }

2022.11.11

input type number를 비밀번호로 표시하기, 모바일 숫자키패드

HTML input type 속성은 하나의 타입만 허용한다. number나, password냐 둘 중 하나를 골라야 한다. 그런데 숫자만 입력 받고, 모바일에서 숫자 키패드가 뜨고, 비밀번호로 표시하고 싶다면? HTML CSS .input-number-password{ -webkit-text-security: disc; } 설명 type="number"는 숫자 인풋이다. inputmode="numeric" 모바일 디바이스에서 일반 키패드 대신 숫자 키패드를 띄운다. class="input-number-password" 웹킷 힌트를 준 클래스를 적용했다. -webkit-text-security 값으로는 disc 말고도 square나 circle 등이 올 수 있으나, disc가 가장 일반적인 패스워드 표시 ..

2022.08.17

input[type="number"] 화살표 및 키보드 막기

CSS input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } JS // input[type="number"] 키보드 막기 $( function(){ $("input[type='number']").on('keydown', function(e){ if(!((e.keyCode > 95 && e.keyCode 47 && e.keyCode < 58) || e.keyCode == 8)) { return false; } }); });

2022.05.18