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

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事件才能获得错误.

你可以看到一个工作小提琴

解

如果我们改变选项添加到select元素的方式,它就像一个魅力.

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

其他不会引发错误的方案

• 如果iframe没有被破坏,而是被隐藏
• 如果在附加到另一个对象的事件中访问该选项(即锚点的onclick事件)

问题

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

Answer 1

尝试将其放入您的 html 页面中，看看是否有任何不同

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