表單Form的submit事件不響應的解決方法

2024-05-06 14:16:56

字體：大中小

來源：轉載

供稿：網友

一、問題描述
類比一下，我用input.select()做了測試，卻能響應select事件。這個原因先放一邊，我們看看先怎么把眼下的問題解決了。
不響應事件的代碼示例：

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]
實際運行，不會有alert出來。
雖然用submit方法來提交表單有違Unobtrustive Javascript的原則，但有時候不得不用，比如做搜索提示（auto-complete)選中Item之后就需要用JS來提交搜索表單。
二、問題分析
既然本身不響應事件，那只有手工觸發這些事件了，確定手工觸發方案之前先回顧一下事件的注冊方式：
“原始”的注冊方式有兩種，看代碼示例：

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]
這樣的注冊事件，會給form增加了一個方法onsubmit。所以，可以通過直接執行這個方法，等同于手工觸發了事件。
看代碼示例：

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]
這樣可以得到一個alert。
但是在如今“先進”的DOM2標準注冊方式以及IE的注冊方式attachEvent已經很常用。這些注冊方式，onsubmit方法是不存在的，如果使用form.onsubmit()會直接報錯。
三、解決方案
當然“先進”的注冊方式本身也提供了手工觸發事件的解決方案，只是要針對DOM2標準和IE寫不同的程序，另外這個程序，對“原始”的注冊方式也一樣有效。請看代碼示例：

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]
四、代碼總結
這里不再對各細節方法做說明，不熟悉的朋友請自行查閱相關資料。我們把整個代碼串起來：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK">             </SPAN>
</div>
</div>
<div   id="iwvjtn8m0"   class=page1>
<p align="center" class="pageLink"></p>
</div>

<div   id="iwvjtn8m0"   class="fenxiang">

<div style="text-align:left">上一篇：<a href='/wen/2024/05-06/1045352.html'>javascript把15位身份證轉成18的函數</a></div>
<br>
<div style="text-align:left">下一篇：<a href='/wen/2024/05-06/1045354.html'>javascript replace()用法詳解附實例代碼</a></div>
<br>
<script src=/d/js/acmsd/gao21.js></script>

</div>

<div   id="iwvjtn8m0"   class="pinglun">

<script>
		  function CheckPl(obj)
		  {
		  if(obj.saytext.value=="")
		  {
		  alert("您沒什么話要說嗎？");
		  obj.saytext.focus();
		  return false;
		  }
		  return true;
		  }
		  </script><form action="/e/pl/doaction.php" method="post" name="saypl" id="saypl" onsubmit="return CheckPl(document.saypl)">
<table width="100%" border="0" cellpadding="0" cellspacing="0" id="plpost">

學習交流