jquery submit ie6下失效的原因分析及解决方法

《jquery submit ie6下失效的原因分析及解决方法》攻略

问题描述

在ie6下，使用jQuery中的submit()方法提交表单时，会出现失效的情况。这是因为ie6中的submit()方法是基于form元素的submit方法实现的，而jQuery中将form.submit()方法重写后，导致ie6中submit()方法失效的问题。下面我们将解决这个问题。

原因分析

在ie6下，提交表单的方式是通过form元素的submit()方法实现的。而在jQuery中，为了支持ajax表单提交，重新定义了form元素的submit()方法，使得在ie6下使用jQuery的submit()方法提交表单会失效。

解决方法

方法一：使用原生的submit方法

在ie6下，可以使用原生的form.submit()方法提交表单，而不是使用jQuery的submit()方法。例如，假设我们的表单id为“myForm”，可以使用以下代码提交表单：

document.getElementById("myForm").submit();

这样就可以绕过jQuery的submit()方法，使用原生的表单提交方法提交表单。

方法二：使用prop()方法修改submit方法

在jQuery 1.6及以上版本中，可以使用jQuery的prop()方法修改submit方法，使得在ie6下也能正常工作。例如，以下代码可以修改提交表单的默认行为：

$(function(){
  $('form').prop('submit', function() {
    //自定义的表单提交代码
    return false;
  });
});

这样就可以在ie6下使用jQuery的submit()方法提交表单了。

示例说明

示例一：使用原生的submit方法提交表单

假设我们有如下的HTML代码：

<form id="myForm" action="process.php" method="post">
  <input type="text" name="name" />
  <input type="submit" value="提交" />
</form>

在ie6下，我们可以使用以下代码提交表单：

document.getElementById("myForm").submit();

示例二：使用prop()方法修改submit方法提交表单

我们可以在jQuery的ready()事件中使用prop()方法修改submit方法，例如：

$(function(){
  $('form').prop('submit', function() {
    //自定义的表单提交代码
    return false;
  });
});

这样就可以在ie6下使用jQuery的submit()方法提交表单了。