By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
443,750 Members | 1,367 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 443,750 IT Pros & Developers. It's quick & easy.

innerHTML and javascript

sabesneit
P: 4
Hi, I'm tring to execute some javascript with innerHTML but nothing happen, here a simplified example:
[HTML]
<html>
<head>
<title>this doesnt work!</title>
<script language="javascript">
function DoSomething()
{
document.getElementById("div1").innerHTML = "<script language=\"javascript\">\n alert(\"hello world\");\n <\/script>";
}
</script>
</head>
<body>
<div id="div1"></div>
<input type="button" onClick="DoSomething();" value="damn do something!">
</body>
</html>
[/HTML]

if you find out why it doesnt pop "hello world" or the way to do it, thank to let me know.
Sébastien
Nov 15 '06 #1
Share this Question
Share on Google+
3 Replies


ronverdonk
Expert 2.5K+
P: 4,258
Because the alert is not triggered. The following does work:
[html]
<html>
<head>
<title>this doesnt work!</title>
<script language="javascript">
function DoSomething()
{
document.getElementById("div1").innerHTML =
"<input type='button' onclick='javascript:alert(\"Hello to you too!\");' value='Hit me' />";
}
</script>
</head>
<body>
<div id="div1"></div>
<input type="button" onclick="DoSomething();" value="damn do something!">

</body>
</html>
[/html]

Ronald :cool:
Nov 15 '06 #2

sabesneit
P: 4
Thank you but it's not exactly what i need. here another example, the first button change the div's javascript and the second button use the javascript function in the div.

try this, click the second button, the first and the second again.
the expected result is "no!" and "Hello world!" but i get "no!" 2 times even if changed the function DoIt() with the first button;

thank for your anwser

[HTML]
<html>
<head>
<title>this doesnt work!</title>
<script language="javascript">
function DoSomething()
{
document.getElementById("div1").innerHTML = "!<script language=\"javascript\">\n function DoIt(){\nalert(\"hello world\");\n}\n <\/script>!";
}
</script>
</head>
<body>
<div id="div1">
#<script language="javascript">
function DoIt()
{
alert("no!");
}
</script>#
</div>
<input type="button" onClick="DoSomething();" value="Change function"><br>
<input type="button" onClick="DoIt();" value="Button, Say hello">
</body>
</html>
[/HTML]
Nov 16 '06 #3

Expert 100+
P: 392
The problem you are running into is that JS functions are treated like objects not text. An elements event handlers, in this case onclick, are set on page load so over writing the text after the page has loaded is not going to work for you.

If you want to change an elements assigned event handler you need to do something like this

<input type="button" id="button1" onClick="changeEvent();" value="Change function"/><br />


<script language="javascript">
function changeEvent();
{
document.getElementById("button1").onclick = new Function("function DoIt(){ alert(\'Event Changed\');}";
}
</script>
Nov 16 '06 #4

Post your reply

Sign in to post your reply or Sign up for a free account.