I have the following in its own DIV

<script>
function newfunc()
{
alert("here");
}
</script>
<button type="button" onclick="newfunc()">Press me</button>

On IE and FF it works fine, but on Safari (at least Safari 4.0.5) it says “ReferenceError can't find variable” - now the content was loaded into the DIV dynamically and it seems Safari can't see the function definitions within this DIV - however, if I put the function newfunc() onto the main HTML page (i.e. not in the DIV) then the button press does call the function.

It’s as if Safari doesn't see the Javascript functions that have been added to the DIV.

Any help would be appreciated.

adam

I have the following in its own DIV

<script>
function newfunc()
{
alert("here");
}
</script>
<button type="button" onclick="newfunc()">Press me</button>

On IE and FF it works fine, but on Safari (at least Safari 4.0.5) it says “ReferenceError can't find variable” - now the content was loaded into the DIV dynamically and it seems Safari can't see the function definitions within this DIV - however, if I put the function newfunc() onto the main HTML page (i.e. not in the DIV) then the button press does call the function.

It’s as if Safari doesn't see the Javascript functions that have been added to the DIV.

Any help would be appreciated.

adam

• javascript
• safari
• referenceerror

• If that's the case what do you expect us to do? Your only choice is to put the JS code in the main body. Tell us what language is your server side code, post your current code and we'll try to guide you through this. – user447356 Commented Dec 8, 2010 at 13:31
• its not possible to put all the functions into the main page as some functions contain dynamic content dependant on for example session data which is checked when the div content is loaded. – adam Commented Dec 8, 2010 at 15:47
• see gymadvisory.co.uk press Find Gyms it will probably display an unstyled page - this is because the button element has no type="button" attribute yet and because the jquery assigned click function tries to call javascript functions that it can't find it does a submit - adding the missing attribute will stop that but then pressing the button does nothing – adam Commented Dec 8, 2010 at 15:52
• also - once the unstyled page is displayed press back button and try again - it now should work ! not sure why the page gone back to should work – adam Commented Dec 8, 2010 at 15:54
• reverted back to previous version of app and seems ok so must be bug in javascript changes albeit still strange behaviour. – adam Commented Dec 8, 2010 at 16:22

1 Answer 1

Javascript that is added dynamically to a page needs to be eval-d in order to correctly initialise.

In order for that to work correctly for function definitions they need to be formatted slightly differently. eg:

<script>
newfunc = function()
{
alert("here");
}
</script>
<button type="button" onclick="newfunc()">Press me</button>

After adding the content to the DIV, extract all tag elements from the DIV and eval their contents.

For example, using PrototypeJS (http://www.prototypejs/api/):

$(divid).innerHTML.evalScripts();

Where divid is the ID of the div you just populated with content.