폼 제출 전에`onclick()`이 호출되는 이유는 무엇입니까?

나는 submit 버튼을 통해 제출되는 양식을 가지고 있습니다. 클릭하면 자바 스크립트 유효성 검사가 수행되고 텍스트 상자 아래에 오류 필드가 표시됩니다. 따라서 오류가있는 경우 컨트롤은 같은 페이지로 돌아갑니다. 내 문제는 양식 게시 후, 나는 두 오류 필드를보고 유지하고 하나를 삭제하고 하나만 유지해야합니다. 이를 위해폼 제출 전에`onclick()`이 호출되는 이유는 무엇입니까?

, 난 제출 버튼에서 클릭 함수를 호출하고 거기에 내가 오류 DIV ID가 같이 존재 여부를 확인하는 것을 시도하고있다 :

checkErrors() 방법 내부 지금

<input type="image" name="submit" onclick = 'checkErrors()'>

function checkErrors(){ 
var errorElem1 = document.getElementById('errField1'); 
var errorElem2 = document.getElementById('errField2'); 
if((errorElem1 != null) && (errorElem2 != null)){ 
alert("Two error fields."); 
errorElem2.style.display='none'; 
} 
}

이제 버튼을 클릭하면 알림이 표시되지 않습니다.

그래서 나는 경우 조건을 제거하고 그것을 유지 :

function checkErrors(){ 
var errorElem1 = document.getElementById('errField1'); 
var errorElem2 = document.getElementById('errField2'); 
errorElem2.style.display='none'; 
} 
}

지금, 내가 불을 지르고 콘솔에서 오류를 참조하십시오 elem2 is null를. 즉, onclick이 실행되고 포스트 만 작성되므로 onclick 후에 elem2이 발견되지 않습니다.

이 양식으로 제출 :

<form name="IntitalJspPage" method="post" action="Controller" onsubmit="validate(this); return false;">

지금 내가 여기서 할 수있는 양식을 제출하고 오류 필드가 페이지에 렌더링 된 후 온 클릭 전화를받을 무엇을?

출처

2013-06-04 The Dark Knight

사실, 비동기 아약스 유효성 검사가 발생하고 오류가있을 경우 동일한 페이지가 오류 필드에 오류와 함께로드됩니다. 따라서 기본적으로 양식을 제출할 때 동일한 페이지에 AJax 사후 검증이로드됩니다. –

비동기 아약스 유효성 검사? 당신이 제공하는 코드에서 그게 뭐지? – MaVRoSCy

질문은 '아약스 확인'에 관한 것이 아닙니다. 오히려 폼이 제출되고 같은 페이지에 내용이로드 된 후에 내가'onclick'을 호출 할 수 있는지 여부입니다. –

당신은 입력으로 이미지를 사용 이미지 유형이 없습니다. 대신에 type = "button"을 사용하십시오. 대신 validate 방법으로 전화 양식을 제출하십시오.

출처

2013-06-04 13:49:38 iMBMT

내 의견보기 MaVRoSCy의 섹션에 게시했습니다. –

@TheDarkKnight 아약스 호출을 사용하면 더 나은 방법으로 처리 할 수 있다고 생각합니다. ajax 호출을 작성하십시오. 버튼 클릭/이미지 호출 아약스 방법을 클릭하십시오. 그런 다음 제출 완료 통화. 호출 오류 메서드를 수행하십시오. – iMBMT

코드 조각이있는 인터넷 리소스를 가르쳐 주시겠습니까? 내가 이해하고 구현하는 것이 유용 할 것이다. –

양식 제출이 끝나면 기본적으로 페이지 새로 고침과 같은 결과가 표시됩니다. 따라서 DOM은 처음부터 재구성됩니다. 제출 작업 전에 초기화 한 모든 자바 스크립트 변수가 재설정됩니다.

원하는 작업을 수행하는 것은 매우 간단합니다. 이

<input id="mysubmit" type="image" name="submit" onclick = 'checkErrors()'>

방법 1 (일반 자바 스크립트)처럼 작업을 수행 할 수 있습니다

<body onload="document.getElementById('mysubmit').click(); return false;">

방법 2 (JQuery와) 형이하는 type.input

$(document).ready(function() { 
    $('#mysubmit').click(); 
});

출처

2013-06-04 13:47:33 MaVRoSCy

이 'img' 태그는 무엇인가요? 어떤 방법 으로든 문제는 두 가지 오류 파일을 받고 있는데, 양식을 게시 한 후 피하려고합니다. 따라서 'if'조건을 사용하는 코드 조각은 중복되기 때문에 양식 제출 이후에 오류가 발생하기 전에 필요합니다. –

당신은 DOM로드시'name = "submit"'으로 입력을 원한다는 것을 의미합니까? – MaVRoSCy

내말은 양식 제출이 끝난 후에는 onclick 메서드가 호출되기를 바랍니다. –

폼 제출 전에`onclick()`이 호출되는 이유는 무엇입니까?

답변

관련 문제