Injecting html with a name=xxx seems to corrupt a function with the same name

a. create a function xxx

b. inject some html with name=xxx [I'm using <form> but not sure if it's specific got <form> only]

function xxx works 1st time only. 2nd time I get a javascript error - xxx is not a function.

Both IE & FF have the problem, both IE & Firebug debuggers can see the original function and execute it.

sample code that reproduces it is here.

if i rename the function tester() to another name it works. The 2nd click should give you the 'undefined function' error.

<html>

<head>

var seq = 0;

function tester() {

seq++;

$('#tester')[0].innerHTML = "<form name='tester'>I've been clicked ".concat(seq," time(s)</form>");

}

</script>

</head>

<body>

<div id='tester'>tester div here</div>

<a href='#' onclick='tester();return false'>click me 2 times</a>

</body>

</html>

Attachments (0)

Change History (2)

_comment0:	You have a name conflict, this is independent of jQuery. \ \ http://kangax.github.com/domlint/ \ \ Also I know it's just a demo but: \ \ > `$('#tester')[0].innerHTML` \ This will cause memory leaks if #tester has jQuery data or events. \ \ > `onclick=` \ Inline event handlers are a bad idea. http://docs.jquery.com/Won't_Fix#Inline_Event_Handlers → 1337614986950893
resolution:	→ invalid
status:	new → closed

You have a name conflict, this is independent of jQuery.

Also I know it's just a demo but:

$('#tester')[0].innerHTML = ...

This will cause memory leaks if #tester has jQuery data or events.

onclick= ...

Side navigation