Question

从iframe向select元素添加选项时遇到问题。该代码在Chrome，Firefox和Opera中运行良好，但在IE11中，我们在尝试从父窗口访问最近创建的选项时得到“SCRIPT70：Permision denied”。

我们需要的是将选项添加到从列表中选择它们的选择元素。列表显示在灯箱（带有iframe）中，当选择一个元素时，必须将其添加到select元素，然后关闭灯箱（并销毁iframe）。我们拥有的是这样的（简化）：

父窗口：

<select id="dropdown">
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>

<!-- in the real code, this iframe is shown when a button is pressed -->
<iframe src="iframe.html"></iframe>
<script>
  $(document).ready(function() {
    $('#dropdown').on('change', function() {
      console.log($(this).children().last().val());
    });
  });
</script>

iframe.html：

<a href="#" data-val="4">Add 4</a>
<a href="#" data-val="5">Add 5</a>
<a href="#" data-val="6">Add 6</a>
<script>
  $(document).ready(function() {
    $('a').on('click', function() {
      var p = window.parent;
      if(p) {
        var dropdown = p.document.getElementById('dropdown');
        if(dropdown) {
            var opt = new Option($(this).data('val'), $(this).data('val'));
            dropdown.options[dropdown.options.length] = opt;
            //close self
            $('iframe', p.document).remove();
        }
      }
    });
  });
</script>

如果您选择iframe的任何项目，该选项将添加到select元素并且iframe将被销毁。现在，如果您访问附加到select元素的onchange事件中最近添加的选项，则会得到“SCRIPT70：Permision denied”。而最奇怪的是，它不会在第一次触发事件时发生。您需要触发onchange事件至少两次以获得错误。

您可以看到a working fiddle

解决方案

如果我们更改选项添加到选择元素it works like a charm的方式。

//dropdown.options[dropdown.options.length] = opt;
dropdown.appendChild(opt);

不会引发错误的其他方案

If the iframe isn't destroyed, but hidden
If the option is accessed in an event attached to another object（即锚点的onclick事件）

问题

我希望有人（也许是一些在IE团队工作的微软员工）可以解释这种奇怪行为的细节。

Answer 1

尝试将其放入您的html页面，看看它是否有任何区别

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

SCRIPT70：从最近关闭的iframe中添加选项元素的选项时，权限被拒绝

解决方案

不会引发错误的其他方案

问题

1 个答案: