Question

我是jquery的新手而且我被卡住了。这个页面在Firefox和Chrome中完美运行，但在IE8的beforeSend功能中，无论我做什么，我总是得到“所有字段都是必需的”。有人可以向我指出IE正在做什么总是导致此功能失败？感谢。

<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中的一切都很好用。它提交到数据库并给我我正在寻找的成功消息。不确定这个功能是什么。

Answer 1

尝试更改验证部分，如下所示。

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

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

Answer 2

成功被称为正确执行（即状态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) {
    ..
    ..
}
...

Jquery AJAX beforeSend函数在IE 8中失败

2 个答案: