IE10 - 이상한 양식 제출 문제

아래의 코드를 참조하십시오 :IE10 - 이상한 양식 제출 문제

<!DOCTYPE html> 
<html> 
<body> 
<form name="editProfileForm" method="post" action="profileDataCollection.do"> 
    <input type="text" id="credit-card" name="credit-card" onfocus="unmaskCC(this);" onblur="maskCC(this);" /> 
    <input type="hidden" name="ccValue" value=""/> 
    <button type="submit">Continue</button> 
</form> 
<script type="text/javascript"> 
function unmaskCC(field){ 
    /*code for unmasking credit card field*/ 
    alert("unmask called"); /*For demo purpose introduced an alert*/ 
} 
function maskCC(field){ 
    /*code for masking the credit card field*/ 
    alert("mask called"); /*For demo purpose introduced an alert*/ 
} 
</script> 
</body> 
</html>

문제 설명 : 내 JSP 페이지 중 하나에 위의 코드를 가지고있다. 이 페이지가 Internet Explorer 10에서 렌더링 될 때 이상한 문제가 발생합니다. 계속 버튼 (즉, 양식의 제출 버튼)을 누르면 신용 카드 입력란의 자동 초점이 자동으로 실행되고 'unmaskCC'기능이 호출됩니다. 양식이 제출되지 않습니다. 이 문제는 IE10에서만 발생합니다.

구글 크롬, 파이어 폭스, 사파리 (데스크톱, 태블릿, 모바일) 과 같은 페이지를 테스트 해봤는데 어디에서나 정상적으로 작동하는 것 같습니다.

처음에 제출을 클릭하면 '이벤트 버블 링'이 발생한다고 생각했지만 계속 버튼은 신용 카드 필드의 형제이기 때문에 발생할 수 없습니다.

또한

참고 : 나는이 문제 즉 button type="button"을 변경 한 후 온 클릭을 통해 양식을 제출에 대한 해결 방법이 자바 스크립트 즉, 예상대로 잘 작동 document.getElementById("editProfileForm").submit();.

그러나 무엇이 <button type="submit">이 예상대로 작동하지 않는지 이해할 수 없습니다.

나는이 IE10 특정 문제에 열중하고 있습니다. 여기의 도움은 매우 높이 평가 될 것입니다.

미리 감사드립니다.

출처

2014-03-06 kcak11

................................ – kcak11

IE (Internet Explorer 11에서도 재현 가능) 문제는 IE의 이벤트 처리 문제로 인한 것 같습니다. 제출 단추를 클릭하면 텍스트 입력 필드가 먼저 포커스를 잃어 onblur 처리기가됩니다. 방아쇠를 당겨서 모달 창이 나타나게하고, 여기 IE는 입력 버튼이 클릭 된 정보를 잃어 버리게됩니다.

alert을 예 : console.log에 의해 문제가 발생하지 않습니다. 실제 코드에서는 onblur 이벤트 핸들러에 일부 요소 또는 위젯에 포커스가있는 항목이있을 수 있습니다. IE에서 이와 유사하게 작업을 추적 할 수 있습니다.

출처

2014-03-06 06:11:32

입력 해 주셔서 감사합니다. – kcak11

IE10 - 이상한 양식 제출 문제

답변

관련 문제