값이 변경되면 <input type =“number”/>가 발생하는 이벤트는 무엇입니까?


답변:


73

change 필드의 값이 변경 될 때 시작되는 이벤트입니다.

HTML5 이벤트 input도 발생 한다고 생각합니다 .


36
oninput'위쪽'및 '아래쪽'화살표를 클릭 할 때만 실행됩니다.
N 1.1

2
그러나 onchange는 적어도 파이어 폭스에서 흐림에서만 발생합니다. 키 누름을 찾아야 할 것 같습니다.
andho

onchange를 두 오페라에서 일하지만 oninput 크롬에서 작동 할 oninput (I은 이벤트 핸들러에서 false를 반환하는 경우에만 다음과 - 그렇지 않으면 크롬 반복 이벤트 oninput을 해고)
이안 옥 슬리

2
change버튼을 클릭 할 때만 값을 입력해도 실행되지 않습니다 (적어도 Firefox에서는).
Timmmm

5
input간의 융합과 같다keyup change
탄 트룽

37

jQuery의 경우 다음 코드가 Chrome에서 키보드 입력, 마우스 휠 변경 및 버튼 클릭을 다루고 Firefox에서 키보드 입력을 처리한다는 것을 발견했습니다.

$("input[type=number]").bind('keyup input', function(){
    // handle event
});

2
그것도 '변경'을 추가하면 완벽합니다. 여전히 외부 변경 사항을 듣고 싶을 것이며 어쨌든 추가해도 아무런 문제가 없습니다.
Matt Fletcher

또한 입력 필드 내에서 스크롤 이벤트를 선택하려면 '마우스 휠'을 사용하십시오.
Matt Fletcher

4
참고 .bind()지금의 찬성되지 않습니다.on()
마이클 헤이즈

7

나는 것을 발견 onkeyup하고 onchange버튼을 클릭하고 마우스 휠 스크롤, 위로 아래로 키를 누를 때 화살표, 크롬 (19)이 핸들 직접 입력 한 값에 덮여 다.

onchangeChrome에서는 단독으로 충분하지만 필드를 텍스트 상자로만 렌더링하는 다른 브라우저 onkeyup에는 새 값을 읽는 데 완벽하게 작동 하는 바인딩이 필요합니다 .

mousewheel이벤트를 개별적으로 바인딩하는 것은 덜 성공적이었습니다. 이벤트가 너무 일찍 시작되어 (필드 값이 업데이트되기 전에) 항상 필드의 이전 값을 제공했습니다.


이것은 Firefox에서도 마찬가지입니다.
barfuin

5

onchange흐림 이벤트가 발생하지만 oninput이벤트가 발생 당신이 입력. oninput이벤트에 타이머를 설정 onchange하고 사용자가 1 초 동안 입력을 중지했을 때 이벤트를 시작하고 싶을 수 있습니다 .


당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.