Question

我正在尝试创建一个通过jQuery发布数据的表单，并将返回值填充到同一个DIV中。这样，页面就不会在后期操作上刷新。

<div id="add_value_form">

<form method="POST" action="#" onsubmit='return false'>
  <!-- input fields -->
  <input type="submit" value="Add" onclick='post_form("/add_value");'>
</form>

</div>

JS功能：

function post_form(url) {
  $.post(url, {'test':'test'}, function(data) {
    $("#add_value_form").empty().append(data); 
  }, "text");
}

这在FF3中完美运行，但它只能在IE6 / 7中随机工作。

服务器确认帖子请求是从IE传来的，但它只会偶尔得到帖子数据。

好奇，我决定提醒数据变量：

$.post(url, {'test':'test'}, function(data) {alert(data);}, "text");

当然，FF3会每次都打印出返回HTML，而IE6 / 7主要是打印空白，偶尔会返回HTML。我无法找到关于这个问题的任何内容，所以我做错了什么？

已解决：我将此跟踪到我在请求处理代码中的HTTP重定向。因此处理POST请求的函数会抛出重定向，IE不喜欢它。我当时总有精神上的便秘，我真的不需要重定向。

当然，奇怪的是，这在FF中起作用，IE有时也可以正常工作，重定向到位。

Answer 1

我想说在这种情况下你根本不必使用表格标签。

<div id="add_value_form">
  <!-- input fields -->
  <input type="button" value="Add" onclick='post_form("/add_value");' />
</div>

修改正如Paolo Bergantino所说我也会避免使用内联javascript。所以改为使用：

<div id="add_value_form">  <input type="button" value="Add" class="formSubmitButton" /> </div>

<强>的Javascript

$(document).ready(function() { $('.formSubmitButton').click(function() { $.post('/add_value', {'test':'test'}, function(data) { $("#add_value_form").empty().append($(data)); }, "text"); }); });

更新由于这仍然会导致问题，我会使用$.ajax方法执行一些测试。此外，我不相信POST调用会被缓存，但以防万一尝试将缓存设置为false。为确保您没有序列化问题，另一项测试是传输已编码的数据。如果您仍有问题，可以尝试将dataType设置为文本

$.ajax({ url: '/add_value', type: 'POST', cache: false, data: 'test=testValue', dataType: 'text', complete: function(xhr, textStatus) { alert('completed'); }, success: function(data) { alert(data); }, error: function(xhr, textStatus, errorThrown) { alert('woops'); } });

在JQuery中发布表单并填充DIV - 在IE中断开

1 个答案: