2011-12-31 86 views
1

我新來的jQuery和我卡住了。這個頁面在Firefox和Chrome中完美運行,但是在IE8的beforeSend函數中,無論我做什麼,我總是會得到「所有字段都是必需的」。有人能告訴我什麼IE正在做的事情總是導致這個功能失敗?謝謝。Jquery AJAX beforeSend函數失敗IE 8

<html> 
<head> 
<title>Contact form</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<link href="../css/modal_company.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript" src="../js/jquery-1.7.1.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
function getQueryParams(qs) { 
    qs = qs.split("+").join(" "); 
    var params = {}, 
     tokens, 
     re = /[?&]?([^=]+)=([^&]*)/g; 
    while (tokens = re.exec(qs)) { 
     params[decodeURIComponent(tokens[1])] 
      = decodeURIComponent(tokens[2]); 
    } 
    return params; 
} 
var $_GET = getQueryParams(document.location.search); 
var holy = $_GET["strUser"] 
document.getElementById('hide').value = holy; 
    $('#submit_button').click(function() { 
     $.ajax({ 
      type: 'POST', 
      url: 'item_add.php', 
      data: $('form').serialize(), 
      dataType: 'json', 
      beforeSend: function() { 
       var item_num = $('#item_num').val(); 
       var descript = $('#descript').val(); 
       var quanti = $('#quanti').val(); 
       var fdaa = $('#fdaa').val();     
       if (!item_num[0] || !descript[0] || !quanti[0] || !fdaa[0]) { 
        $('#output').html('All fields are required'); 
        return false; 
       }     
      }, 
      success: function(response) { 
       if (response.status == 'success') { 
        $('#formcont').html(); 
       } 
       $('#output').html(response.errmessage); 
      } 
     });   
    }); 
}); 
</script> 
</head> 
<body> 
<div id="formcont" style="text-align:center; margin:0; padding:0; height:100%;"> 
    <form id="myform"> 
    <fieldset> 
     <div style="text-align:center; margin-bottom:20px; border-bottom:thin #000; width:100%;"> 
     <h2>Add an Item</h2> 
     </div> 
     <p> 
     <label for="hide"><strong>Manufacturer:</strong></label> 
     <input type="text" readonly name="hide" id="hide" size="30" value="" style="background-color:#CCC" /> 
     </p> 
     <p> 
     <label for="item_num"><strong>Item/Catalog #:</strong></label> 
     <input type="text" name="item_num" id="item_num" size="30" /> 
     </p> 

     <p> 
     <label for="descript"><strong>Description:</strong></label> 
     <input type="text" name="descript" id="descript" size="30" /> 
     </p> 
     <p> 
     <label for="quanti"><strong>Quantity Per Unit:</strong></label> 
     <input type="text" name="quanti" id="quanti" size="30" /> 
     </p> 
     <p> 
     <label for="fdaa"><strong>Is this Item FDA Approved?</strong></label> 
     <input type="text" name="fdaa" id="fdaa" size="30" /> 
     </p>  
    </fieldset> 
    <div id="output" style="width:100%; color:red; text-align:center;"></div> 
    <div style="text-align:center; margin-bottom:0px; border-bottom:thin #000; width:100%; margin-left:105px;"> 
     <p style="text-align:center;"> 
     <input type="button" value="Submit" id="submit_button" /> 
    </p> 
     </div> 
    </form> 
</div> 
<div id="output"></div> 
</body> 
</html> 

注:如果我刪除該功能,那麼在IE中一切正常。它提交給數據庫並給我我正在尋找的成功消息。不確定這個功能是什麼。

+1

在字符串上做[[0]]的目的是什麼?例如,它甚至不支持IE7。 – Esailija 2011-12-31 13:24:51

+0

它是在我工作的原始代碼中,它工作,所以我沒有碰它。這可能是問題嗎?它可以在Firefox和Chrome中正常工作。 – 2011-12-31 13:26:30

+0

試試'!item_num || !description || !quanti || !fdaa' ...我有一個預感,你的IE8版本不支持字符串下標記法:P(我的,但我在IE9兼容模式下運行)代碼將實際上是相同的 - 它會通過if條件if任何變量都是空字符串。 – Esailija 2011-12-31 13:29:59

回答

1

嘗試更改您的驗證部分,如下所示。

if (item_num == '' || descript == '' || quanti == '' || fdaa == '') { 
    $('#output').html('All fields are required'); 
    return false; 
} 

不需要爲字符串使用[0]。

-1

在正確執行時調用成功(即狀態4或狀態"complete")。使用錯誤的錯誤處理...

$.ajax({ 
     type: 'POST', 
     url: 'item_add.php', 
     data: $('form').serialize(), 
     dataType: 'json', 
     beforeSend: function() { 
      var item_num = $('#item_num').val(); 
      var descript = $('#descript').val(); 
      var quanti = $('#quanti').val(); 
      var fdaa = $('#fdaa').val();     
      if (!item_num[0] || !descript[0] || !quanti[0] || !fdaa[0]) { 
       $('#output').html('All fields are required'); 
       return false; 
      }     
     }, 
     success: function(response) { 
      ... 
      $('#formcont').html(); 
      ... 
     }, 
     error: function(status, errorText) { 
      ... 
      $('#output').html(response.errorText); 
      ... 
     } 
}); 

在其他情況下,當你尋求一個較低的水平更多的控制,你可以使用:

complete(jqXHR, textStatus) 

如下...

... 
complete: function(req, status) { 
    .. 
    .. 
} 
...