양식 메소드가 JS에 전화하여 직접 제출 된 경우 제출 이벤트가 응답하지 않습니다. 왜? 알고 있다면 답장 해주세요. 비유를 위해 input.select ()를 사용하여 테스트했지만 선택 이벤트에 응답 할 수있었습니다. 이 이유를 제쳐두고 현재 문제를 먼저 해결하는 방법을 살펴 보겠습니다.
이벤트에 응답하지 않는 코드의 예 :
<form id = form1 action = http : //www.jb51com> </form>
<스크립트 유형 = 텍스트/JavaScript>
var form = document.getElementById ( 'form1');
form.onsubmit = function () {
경고 (1);
};
form.submit ();
</스크립트>
실제 작업에서는 경고가 나오지 않습니다.
제출 방법을 사용하여 제출 양식을 사용하면 눈에 잘 띄지 않는 JavaScript의 원칙을 위반하지만 때로는 사용해야합니다. 예를 들어, 항목을 선택한 후에는 JS를 사용하여 검색 양식을 제출해야합니다.
2. 문제 분석이벤트 자체가 응답하지 않기 때문에 이러한 이벤트를 수동으로 트리거 할 수 있습니다. 매뉴얼 트리거 계획을 결정하기 전에 이벤트의 등록 방법을 검토해 봅시다.
두 가지 원래 등록 방법이 있습니다. 코드 예제를 참조하십시오.
<form id = form1 action = https : //www.vevb.com onsubmit = alert (1)> </form> <form id = form1 action = https : //www.vevb.com> </form>
<스크립트 유형 = 텍스트/JavaScript>
document.getElementById ( 'form1'). onsubmit = function () {
경고 (1);
}
</스크립트>
이러한 등록 이벤트는 onsubmit에 메소드를 추가합니다. 따라서이 방법을 직접 실행할 수 있는데,이 방법은 이벤트를 수동으로 트리거하는 것과 동일합니다.
코드 예를 참조하십시오.
<스크립트 유형 = 텍스트/JavaScript>
form.onsubmit ();
</스크립트>
이것은 당신에게 경고를줍니다.
그러나 고급 DOM2 표준 등록 방법 및 IE 등록 방법 첨부 배치는 이미 매우 일반적으로 사용됩니다. 이 등록 방법에는 onsubmit 방법이 존재하지 않습니다. form.onsubmit ()을 사용하는 경우 오류가 직접보고됩니다.
3. 솔루션물론 고급 등록 방법 자체는 수동으로 이벤트를 트리거하는 솔루션을 제공하지만 DOM2 표준 및 IE에 대한 다른 프로그램 만 작성하면됩니다. 또한이 프로그램은 원래 등록 방법에도 효과적입니다. 코드 예제를 참조하십시오 :
<스크립트 유형 = 텍스트/JavaScript>
// 즉, 화재 이벤트
if (form.fireevent) {
form.fireevent ( 'onsubmit');
form.submit ();
// DOM2 화재 이벤트
} else if (document.createevent) {
var ev = document.creeevent ( 'htmlevents');
ev.initevent ( '제출', false, true);
form.dispatchevent (EV);
}
</스크립트>
4. 코드 요약나는 더 이상 세부 사항을 여기에서 설명하지 않을 것입니다. 익숙하지 않은 친구들은 직접 관련 정보를 확인하십시오. 전체 코드를 함께 묶어 봅시다.
<! doctype html public- // w3c // dtd html 4.01 // en http://www.w3.org/tr/html4/strict.dtd>
<html>
<헤드>
<meta http-equiv = content-type content = text/html; charset = gbk>
<title> 제출 </title>
<script type = text/javaScript src = http : //k.kbcdn.com/js/yui/build/utilities.js> </script>
</head>
<body>
<form id = form1 action = https : //www.vevb.com> </form>
<스크립트 유형 = 텍스트/JavaScript>
var form = document.getElementById ( 'form1');
// YUI 레지스터 이벤트
yahoo.util.event.on ( 'form1', '제출', function () {
경고 ( 'yui');
});
// dom0 레지스터 이벤트
form.onsubmit = function () {
경고 (1);
};
// dom2 레지스터 이벤트
if (form.addeventListener) {
form.addeventListener ( '제출', function () {
경고 (2);
}, 거짓);
// IE 레지스터 이벤트
} else if (form.attachevent) {
form.attachevent ( 'onsubmit', function () {
경고 (2);
});
}
// 즉, 화재 이벤트
if (form.fireevent) {
form.fireevent ( 'onsubmit');
form.submit ();
// DOM2 화재 이벤트
} else if (document.createevent) {
var ev = document.creeevent ( 'htmlevents');
ev.initevent ( '제출', false, true);
form.dispatchevent (EV);
}
</스크립트>
</body>
</html>
전체 실행에는 작은 문제가 있습니다. fx에서 form.submit ()가 필요하지 않습니다. 양식을 직접 제출 했으므로이 문장도 저장됩니다. 이유를 알고 있으면 답장하십시오.
이 데모는 IE6/IE7/FX에서 테스트되었습니다.