title: Error in IE when manually calling event handler, given certain conditions
body: <h2>Preface</h2>
  
  <ul>
  <li>Please note, I'm not looking for a code solution, but rather insight into why this may occur.</li>
  <li>The error occurs in IE (tested 7 &amp; 8), but not Firefox, Chrome, Safari.</li>
  </ul>
  
  <h2>Description</h2>
  
  <p>When manually calling a function assigned to <code>onclick</code>, IE with throw a <code>Error: Object doesn't support this action</code> if <em>all of the following conditions</em> are met:</p>
  
  <ol>
  <li>You call the method directly via the element's <code>on[event]</code> property.</li>
  <li>You do not use <code>.call()</code> or <code>.apply()</code>.</li>
  <li>You pass an argument (any argument, even <code>undefined</code>).</li>
  <li>You attempt to assign the return value to a variable.</li>
  </ol>
  
  <p>Violate any one of those rules, and the call succeeds.</p>
  
  <p>The function itself appears to have nothing to do with it. An empty function gives the same result.</p>
  
  <h2>Code</h2>
  
  <pre><code>var elem = document.getElementById('test');  // simple div element.
  var result;               // store result returned.
  
  function test_func(){};   // function declaration.
                            // function expression behaves identically.
  
  elem.onclick = test_func; // assign test_func to element's onclick.
  
  // DIRECT CALL
  test_func();                 // works
  test_func( true );           // works
  result = test_func();        // works
  result = test_func( true );  // works
  
  // DIRECT CALL, CHANGING THE CONTEXT TO THE ELEMENT
  test_func.call( elem );                  // works
  test_func.call( elem, true );            // works
  result = test_func.call( elem );         // works
  result = test_func.call( elem, true );   // works ******** (surprising)
  
  // CALL VIA ELEMENT, USING .call() METHOD, CHANGING THE CONTEXT TO THE ELEMENT
  elem.onclick.call( elem );                  // works
  elem.onclick.call( elem, true );            // works
  result = elem.onclick.call( elem );         // works
  result = elem.onclick.call( elem, true );   // works ******** ( very surprising)
  
  // CALL VIA ELEMENT
  elem.onclick();                 // works
  elem.onclick( true );           // works
  result = elem.onclick();        // works
  result = elem.onclick( true );  // Error: Object doesn't support this action
  </code></pre>
  
  <h2>Summary</h2>
  
  <p>Again, I don't need a code solution. Rather I'm curious if anyone has insight into why IE is implemented this way.</p>
  
  <p>Many thanks.</p>
  
  <hr>
  
  <p><strong>EDIT:</strong> To clarify one thing, nothing with the actual function seems to make any difference. Naming parameters, not naming them, returning the argument, returning a literal value, returning undefined, all of these have no effect.</p>
  
  <p>This is likely because the function seems to never actually get called. As I noted in a comment below, the code leading up to this call runs fine, so it isn't a parsing issue either. But when the interpreter gets to this one, it sees:</p>
  
  <blockquote>
    <p>Variable + AssignmentOperator + DOMElement + EventHandler + CallOperator + Argument</p>
  </blockquote>
  
  <p>...and throws the Error. No manipulation I do seems to make any difference. A valid removal of any one of those, and the Error disappears.</p>
  
  <p>If I place add a variable to the middle of it that stores the handler, then fire it from the variable it works.</p>
  
  <pre><code>var temp = elem.onclick;
  result = temp( true );    // works
  </code></pre>
  
  <p>...but this shouldn't be much of a surprise, since it is effectively the same as the fourth version above.</p>