>  기사  >  웹 프론트엔드  >  Firefox에서 범위 입력 드래그에 대해 onchange 이벤트가 트리거되지 않는 이유는 무엇입니까?

Firefox에서 범위 입력 드래그에 대해 onchange 이벤트가 트리거되지 않는 이유는 무엇입니까?

Mary-Kate Olsen
Mary-Kate Olsen원래의
2024-10-21 18:33:29717검색

Why is the onchange Event Not Triggered for Range Input Drag in Firefox?

범위 입력 드래그 시 Firefox onchange 이벤트가 트리거되지 않음

"범위" 유형의 입력 요소에서 슬라이더를 드래그하면 onchange 이벤트는 슬라이더가 Firefox의 새 위치로 떨어질 때만 트리거됩니다. 대조적으로 Chrome 및 기타 브라우저는 드래그하는 동안 onchange 이벤트를 트리거합니다.

해결책: oninput 이벤트 사용

Firefox는 다음과 같이 릴리스 시에만 onchange 이벤트를 올바르게 트리거합니다. 사양. 모든 브라우저에서 드래그하는 동안 실시간 업데이트를 캡처하려면 대신 oninput 이벤트를 사용하세요.

<code class="html">function showVal(newVal){
    document.getElementById("valBox").innerHTML=newVal;
}</code>
<code class="html"><span id="valBox"></span>
<input type="range" min="5" max="10" step="1" oninput="showVal(this.value)"></code>

브라우저 간 호환성을 위해 oninput과 onchange 결합

브라우저 간 호환성을 보장하려면 oninput 및 onchange 이벤트 핸들러 결합을 고려하세요.

<code class="html"><span id="valBox"></span>
<input
  type="range"
  min="5"
  max="10"
  step="1"
  oninput="showVal(this.value)"
  onchange="showVal(this.value)"
/></code>

이렇게 하면 출시 시 onchange 이벤트가 Firefox에서 계속 트리거되고 oninput 이벤트는 모든 브라우저에서 지속적인 업데이트를 제공합니다.

위 내용은 Firefox에서 범위 입력 드래그에 대해 onchange 이벤트가 트리거되지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.