Dynamically added javascript not executed in Safari & IE_问答_开发者

i'm having trouble executed a block of javascript that is dynamically loaded and insert into the page. This is the code that is loaded (simplified):

<p>i am html-code</p>

<script type="text/javascript">
 alert("i'm here");
</script>

This piece of code is injected with this Mootools command:

new Element('div', {
  'class': 'foo'+item_data[id].contenttype,
  'id': '123',
  'html': code
}).inject($('presentation'));

(The variable code contains the first code snippet.)

In Firefox, this works. When the inject command is called, the paragraph is displayed and the javascript is executed. In IE and Safari, only the paragraph is displaye开发者_JAVA技巧d.

Any hints how I can cope with this problem without 'eval'? Thx in advance.

Here's a good short article on one way to handle it.

The underlying problem is that IE & Safari don't evaluate the <SCRIPT> DOM node after loading it by default; this is arguably a security feature.

The basic trick to fix it is that you have to write it as a function, and set that function to be evaluated on an onload event; that guarantees that the code gets evaluated.

~~Stealing~~ following the article's example, the code would look something like

var script = document.createElement('script');
script.setAttribute('src','myjavascriptfile.js');
script.setAttribute('type','text/javascript');
var loaded = false;
var loadFunction = function()
{
  if (loaded) return;
  loaded=true;
  // your code goes here
  alert("I'm here!");
};
script.onload = loadFunction;
script.onreadystatechange = loadFunction;

Update:

It sounds like you've got a couple of variables going on here. Try simplifying a little bit -- instead of depending on MooTools, make a simple basic HTML page and just put your code into that.

Here's an example:

<?xml version='1.0' encoding='utf-8'?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'>
<head>
  <meta http-equiv='content-type' content='text/html; charset=utf-8' />

  <title>Trial</title>
  <meta name='generator' content='BBEdit 9.6' />
  <script type="text/javascript">
  //<![CDATA[
  var script = document.createElement('script');
  script.setAttribute('src','myjavascriptfile.js');
  script.setAttribute('type','text/javascript');
  var loaded = false;
  var loadFunction = function(){
    if (loaded) return;
    loaded=true;
    // your code goes here
    alert("I'm here!");
  };
  script.onload = loadFunction;
  script.onreadystatechange = loadFunction;
  //]]>
  </script>
</head>

<body>
</body>
</html>

That's clean Tidy-ed code that should work on the most neurotic of acceptable browsers, and IE as well. Assuming you have a javascript source file to be loaded as myjavascriptfile.js, it should work.

Then I'd suggest using this as myjavascriptfile.js to start with:

// myjavascriptfile.jx
alert("My java script has loaded YAY!!");

I realise this is 4 years later, but I had the same issue recently.

Going back a couple Mootools versions (3.x, 4.x and 5.x), the addEvent worked for me using:

new Element('script', {
    src: 'myscript.js',
    async: true
}).addEvent('load', myFunc).inject(document.getElement('body'), 'top');

One thing I did find was a delay between the script loading and its contents executing.

You can add a delay in the onLoad method, or fire an even in the loaded JS and listen for that instead:

window.addEvent('myscripEvent', myFunc);

new Element('script', {
    src: 'myscript.js',
    async: true
}).inject(document.getElement('body'), 'top');

Then in myscript.js:

/* my code here */

window.fireEvent('myscripEvent');

Dynamically added javascript not executed in Safari & IE

精彩评论

关注公众号

热门标签

图文推荐

Dynamically added javascript not executed in Safari & IE

更多 问答 相关资讯：

精彩评论

关注公众号

热门标签

图文推荐

更多问答相关资讯：