代码之家  ›  专栏  ›  技术社区  ›  Alconja

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

  •  10
  • Alconja  · 技术社区  · 14 年前

    我正在做一个ajax风格的文件上传,将文件以表单形式发布到iframe,并注意到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", ...) 按预期工作?
    • 火车在哪里 submitName
    4 回复  |  直到 14 年前
        1
  •  16
  •   bobince    14 年前

    IE中的一个bug(当然不是!)

    很难相信,我知道,但我们在那里。

    历史(*),设置 name 属性在IE中有很多问题。它往往只能部分保持。例如,在表单字段名上,它不会影响 form.elements[name] 像它应该的那样查找。这似乎是设置 名称 财产不可靠。

    虽然jQuery试图解决类似这样的浏览器错误,但它并不能捕获所有错误,而且还没有完全解决问题的已知方法。

    (*:在IE高达7中。如果您使用标准模式doctype在本机文档模式下运行IE8,并且如果需要使用与X-UA兼容的头/元,则不会出现这两个错误。)

    这个 submitName 出现在开发工具中是一个有趣的IE bug的幕后一瞥,因为它根本没有出现在公开可见的DOM中。如果你看一个 <input> 元素或 <form> 谁的 名称 属性也已在创建后写入。

    因此,似乎正在发生的事情是IE-up-7重定向了所有被称为 名称 子名称 ,即对于表单字段,更改该字段将作为表单提交的一部分生成的数据,但这不会更改实际值 名称

        2
  •  4
  •   Patrick    13 年前

    像这样创建元素

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

    帮我解决了这个问题

        3
  •  2
  •   Felipe Nascimento    14 年前

    这不仅仅是一个jQuery问题,当手动设置时,它也会发生。

    如果使用setAttribute()方法进行设置,即使没有jQuery,也会在刚创建表单或iframe时执行相同的操作!

        4
  •  0
  •   Tristan Warner-Smith    14 年前

    你看过电影吗 markup creation improvements 在jQuery1.4中?

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