Question

我正在通过将表单中的文件发布到iframe来进行ajax样式文件上传，并注意到IE中的一些奇怪行为（似乎发生在6和8中）。基本上在IE中，表单没有正确target iframe，因此响应显示在新窗口中（而不是iframe中）。您可以使用以下最小的HTML / JS集重现问题：

<html>
<head>
  <script src="http://code.jquery.com/jquery-1.3.2.js"></script>
  <script>
    $(document).ready(function(){
      var frameName = "myFrame";
      var $iframe = $("<iframe src=\"about:blank\" />")
              .attr("name", frameName)
              .appendTo("body");
      var $uploadForm = $("<form action=\"http://www.google.com/search\" />")
              .attr("target", frameName)
              .append("<input type=\"text\" name=\"q\" />")
              .append("<input type=\"submit\" />")
              .appendTo("body");
    });
  </script>
</head>
<body>
</body>
</html>

现在（在您发布答案之前），我做了一些调查（使用IE8的开发人员工具），.attr("name", frameName)实际上将属性添加为submitName="myFrame"而不是name="myFrame" }。基于此，我通过将iframe创建代码更改为稍微更糟糕的东西来解决了这个问题：

var $iframe = $("<iframe src=\"about:blank\" name=\"" + frameName + "\" />")
        .appendTo("body");

进行此更改会使表单根据需要发布到iframe中。

我的问题是：

为什么.attr("name", ...)没有按预期工作？
这是jQuery中的错误，IE中的错误（当然不是！？！），还是我错过了一些明显的东西？
submitName属性来自＆amp;它的目的是什么？

Answer 1

IE中的错误（当然不是！？！）

很难相信，我知道，但我们确实存在。

历史上（*），设置name属性在IE中存在许多问题。它往往只是部分持有。例如，在表单字段名称上，它不会像它应该那样影响form.elements[name]查找。这似乎是设置name属性不可靠的另一种情况。

虽然jQuery试图解决这样的浏览器错误，但它并没有捕获所有内容，并且没有任何已知的方法可以完全解决它。

（*：在IE中最多7个。如果您使用标准模式doctype在本机documentMode中运行IE8，并且必要时使用X-UA-Compatible标头/元，则不会出现这两个错误。）

开发工具中出现的submitName是IE漏洞背后的一个有趣的一瞥，因为它根本没有出现在公开可见的DOM中。如果您查看创建后已编写<input>属性的<form>元素或name，也会执行相同的操作。

所以似乎正在发生的事情是，IE-up-to-7将所有使用名为name的属性重定向到一个内部称为submitName的不可见的属性，对于表单字段更改该字段将生成的数据作为表单提交的一部分，但不会更改用于HTMLCollection索引，无线电分组，getElementsByName的实际name属性，或者在[i]帧的情况下，用于定位。

Answer 2

创建像这样的元素

$("<iframe name='frameName' />")

解决了我的问题

Answer 3

这不仅仅是一个jQuery问题，当设置manualy时，它也会发生。

如果使用setAttribute（）方法设置它，即使没有jQuery，它也会在刚刚创建表单或iframe时执行相同操作！同样的方法，使用innerHTML你可以解决它...是的，再次，它是微软摧毁我的一天：/

Answer 4

您是否在jQuery 1.4中看到了markup creation improvements？

如果你觉得讨厌，试试这个：

$('<iframe />',
{
   name: frameName,
   src: 'about:blank'
}).appendTo("body");

在IE中由jQuery设置的iframe`name`属性的奇怪行为

4 个答案: