Geek Answers Handbook

Why function.apply () function does not work across document borders in IE?

I see strange behavior in IE trying to call functions on another page via the .apply () function.

Here is a simple test case:

test1.html:

<HTML>
<HEAD>
<script language="javascript" type="text/javascript">
  var opened = null;

  function applyNone() {
    opened.testFunc.apply(opened);
  }

  function applyArgs() {
    opened.testFunc.apply(opened, ["applied array"]);
  }

  function call() {
    opened.testFunc("called directly");
  }

  function remoteApply() {
    opened.testApply(["used remote apply"]);
  }

  function remoteApplyCopy() {
    opened.testApplyCopy(["used remote apply copy"]);
  }

  function openPopup() {
    opened = window.open("test2.html", "_blank");
  }
</script>
</HEAD>
<BODY>
  <a href="#" onclick="openPopup()">OPEN</a>
  <hr>
  <a href="#" onclick="applyNone()">applyNone</a>
  <a href="#" onclick="applyArgs()">applyArgs</a>
  <a href="#" onclick="call()">call</a>
  <a href="#" onclick="remoteApply()">remoteApply</a>
  <a href="#" onclick="remoteApplyCopy()">remoteApplyCopy</a>
</BODY>
</HTML>

test2.html:

<HTML>
<HEAD>
<script language="javascript" type="text/javascript">
  function testApply(args) {
    testFunc.apply(this, args);
  }

  function testApplyCopy(args) {
    var a = [];
    for(var i = 0; i < args.length; i++) {
      a.push(args[i]);
    }
    testFunc.apply(this, a);
  }

  function testFunc() {
    var s = "Got: ";
    for(var i = 0; i < arguments.length; i++) {
      s += arguments[i] + " ";
    }
    document.getElementById("output").innerHTML += s + "<BR>";
  }
</script>
</HEAD>
<BODY>
  Hi there
  <div id="output"/>
</BODY>
</HTML>

In firefox and chrome, all methods work correctly.

In IE (verified in 6, 7, and 8), all applyArgs () and remoteApply () methods work as expected.

applyArgs () gives the expected "expected JScript object" when trying to apply (line test1.html 11).

remoteApply () gives the same error "expected JScript object" when trying to apply (line test2.html 5).

The problem is that I need to be able to use apply (). I can get around the problem by doing something like the remoteApplyCopy () mechanism, but I try to avoid this. Why doesn’t apply () just work?

+5
4

, Array. , .

test2.html:

function getEmptyArray() {
    return new Array();
}

test1.html:

Array.prototype.cloneToRemote = function (win) {
    var newArray = win.getEmptyArray();
    for (var i = 0; i < this.length; i++)
    {
        newArray.push(this[i]);
    }
    return newArray;
}

:

function applyArgs() {
    opened.testFunc.apply(opened, ["applied array"].cloneToRemote(opened));
}

,

var newArray = new win.Array();

test1.html cloneToRemote(), . , getEmptyArray() test2.html.

+6

, , ... test2 test1, :

<HTML>
<HEAD>
<script language="javascript" type="text/javascript">
  var opened = null;

  function applyArgs() {
    testFunc.apply(opened, ["applied array"]);
  }

  function openPopup() {
    opened = window.open("test2.html", "_blank");
  }

  function testFunc() {
    var s = "Got: ";
    for(var i = 0; i < arguments.length; i++) {
      s += arguments[i] + " ";
    }
    this.document.getElementById("output").innerHTML += s + "<BR>";
  }
</script>
</HEAD>
<BODY>
  <a href="#" onclick="openPopup()">OPEN</a>
  <hr>
  <a href="#" onclick="applyArgs()">applyArgs</a>
</BODY>
</HTML>

, (IE ). , .

0

test2.html testApply() :

function testApply() {
    testFunc.apply(this, arguments);
}

remoteApply () works. But applyArgs () still failed.

0
source

"... applyArgs () gives the expected" expected JScript object "when trying to apply (line test1.html 11). remoteApply () gives the same error" expected JScript object "when trying to apply (line test2.html 5) . ... "

Which particular object is not a "JScript object" as "expected"?

(hint: use a debugger)

- DBJ

0
source

More articles:


All Articles