input type="image" vs img src="http://XXXX"

vs

最近發現ie9以上的版本,如果沒有點選"相容性檢視"會發生很多問題!!

因為ie以前都是使用自己的規格在走,現在才漸漸統一化

在負責的系統中,有看到很多使用img來當做button送form,寫法如


<table border="0" width="100%" id="table2" cellspacing="0" cellpadding="0">
	<tr>
		<td width="104"><iframe id="ifGOTP" src="jsp/atm/CollTaipower_BillKeyGOTP.jsp" width="101" height="27" scrolling="no" name="I1"></iframe></td>
		<td width="40"><input id="imgtextId" name="CHECK_NO0" type="text" size="6" maxlength="6" onKeypress="chkNum();"></td>
		<td width="167"><input type="image" src="images/Button/code.gif" border="0" align="absmiddle" onclick="ifGOTP.location='jsp/atm/CollTaipower_BillKeyGOTP.jsp'" style="cursor:pointer"/></td>
	</tr>
</table>

主要在做驗證碼reflash,要reflash的頁面為iframe,其中出現問題為


<td width="167"><input type="image" src="images/Button/code.gif" border="0" align="absmiddle" onclick="ifGOTP.location='jsp/atm/CollTaipower_BillKeyGOTP.jsp'" style="cursor:pointer"/></td>
	</tr>
</table>

使用<input type="image" src="images/Button/code.gif">會把這整張的頁面(整個form)往onclick的方向送出,這很容易產生問題

主頁面會整個flash,所以需改用<img>這個tag才ok


<table border="0" width="100%" id="table2" cellspacing="0" cellpadding="0">
	<tr>
		<td width="104"><iframe id="ifGOTP" src="jsp/atm/CollTaipower_BillKeyGOTP.jsp" width="101" height="27" scrolling="no" name="I1"></iframe></td>
		<td width="40"><input id="imgtextId" name="CHECK_NO0" type="text" size="6" maxlength="6" onKeypress="chkNum();"></td>
		<!--<td width="167"><input type="image" src="images/Button/code.gif" border="0" align="absmiddle" onclick="ifGOTP.location='jsp/atm/CollTaipower_BillKeyGOTP.jsp'" style="cursor:pointer"/></td>-->
		<td width="167"><img src="images/Button/code.gif" onclick="ifGOTP.location='jsp/atm/CollTaipower_BillKeyGOTP.jsp'" style="cursor:pointer"/></td>
	</tr>
</table>

使用<img src="images/Button/code.gif" onclick="ifGOTP.location='....' "/>這樣的寫法就不會把整個form都送出去了