2012-12-21 54 views
0

我有一個簡單的HTML表單,將不會在IE9提交。它適用於Chrome,FF和IE10。HTML表單不會提交在IE9

我曾嘗試在IE9提交關於Windows 7和IE10在Windows 8

IE10工作,除非我改變瀏覽器模式IE9;那麼它不會提交。

Demo。如果您在任何工作的瀏覽器上點擊「保存」,它會將您帶到虛假的demo_form.asp。

這裏是形式:

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Title</title> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 

     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
     <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
     <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> 
    </head> 
    <body> 
     <div data-role="page"> 
      <div data-role="header"> 
       <h1>Title</h1> 
      </div> 
      <div data-role="fieldcontain"> 
       <div class="error-messsage"> 
        <p/> 
       </div> 
       <p> 
        <form action="demo_form.asp" data-ajax="false" method="get"> 
         <input type="hidden" name="scoreType" id="_scoreType" value="T"/> 
         <div data-role="fieldcontain"> 
          <fieldset class="ui-grid-a"> 
           <div class="ui-block-a">Minutes:</div> 
           <div class="ui-block-b">Seconds:</div> 
           <div class="ui-block-a"> 
            <input type="number" name="score_minutes" value="1" id="_scoreMinutes" maxlength="20" autocomplete="off" data-inline="true"/> 
           </div> 
           <div class="ui-block-b"> 
            <input type="number" name="score_seconds" value="2" id="_scoreSeconds" maxlength="20" autocomplete="off" data-inline="true"/> 
           </div> 
          </fieldset> 
          <input type="hidden" name="score" id="_score" value="62"/> 
         </div> 
         <div data-role="fieldcontain"> 
          <label for="_note">Note:</label> 
          <textarea name="note" cols="40" rows="10" id="_note" autocomplete="off"/> 
         </div> 
         <div data-role="fieldcontain"> 
          <label for="_classAttended" class="select">Class Time:</label> 
          <select name="class_attended" id="_classAttended" data-native-menu="false"> 
           <option value="-1"/> 
           <option value="6">06:00 am</option>> 
</select> 
         </div> 
         <div data-role="fieldcontain"> 
          <label for="_memberRating" class="select">Member Rating:</label> 
          <select name="member_rating" id="_memberRating" data-native-menu="false"> 
           <option value="-1"/> 
           <option value="5">5 </option> 
          </select> 
         </div> 
         <div data-role="fieldcontain"> 
          <label for="_rx">RX</label> 
          <input type="checkbox" name="rx" value="1" id="_rx" data-mini="true"/> 
         </div> 
         <div data-role="fieldcontain"> 
          <a href="http://mysite.com/index.php/welcome/index/TRUE" data-ajax="false" data-role="button" data-inline="true">Cancel</a> 
          <button name="" type="Submit" id="_submit" class="ui-btn-hidden" value="Save" aria-disabled="false" data-inline="true" data-theme="b"/> 
         </div> 
        </form> 
       </p> 
      </div> 
     </div> 
    </body> 
</html> 
+0

什麼是「兼容模式」設置? – Gorgsenegger

+0

如果用' looper

回答

5

你有<div>的是試圖成爲一個<form>這是一個<p>內內。但是<div> s不能是一個<p>內,所以HTML解析器關閉<p>元素,這樣做也關閉<form>。所以保存按鈕不在表格內,因此IE9不知道當你點擊按鈕時要提交什麼。刪除<form>周圍的<p>標籤。

在FF,Chrome和IE10中使用的HTML5分析器有一些漂亮的技巧來應付你無效的標記,但上了年紀IE9分析器無法應付。

此外,你必須<p/><textarea/>。不要這樣做。任何元素都不支持自閉合語法。

+0

它沒有檢查他的HTML的有效性,但是imho的人應該始終確保他們的代碼在他們提出問題之前進行驗證。如果它沒有驗證,他們應該首先得到這個固定的... – Gorgsenegger