添加onclick事件到JavaScript中新添加的元素
我一直在尝试将onclick事件添加到使用JavaScript添加的新元素中。
问题是当我检查document.body.innerHTML我实际上可以看到onclick = alert('blah')被添加到新的元素。
但是,当我点击该元素,我没有看到警告框正在工作。 实际上,与JavaScript相关的任何内容都无法正常工作
这里是我用来添加新的元素:
function add_img() { var elemm = document.createElement('rvml:image'); elemm.src = 'blah.png'; elemm.className = 'rvml'; elemm.onclick = "alert('blah')"; document.body.appendChild(elemm); elemm.id = "gogo"; elemm.style.position='absolute'; elemm.style.width=55; elemm.style.height=55; elemm.style.top=200; elemm.style.left=300; elemm.style.rotation=200; }
这里是我如何调用这个函数:
<button onclick=add_img()>add image</button>
现在,图像完美地绘制在浏览器内部。 但是,当我点击图像,我没有得到这个警报。
.onclick
应该被设置为一个函数而不是一个string。 尝试
elemm.onclick = function() { alert('blah'); };
代替。
不知道,但尝试:
elemm.addEventListener('click', function(){ alert('blah');}, false);
你不能通过string来分配一个事件。 使用:
elemm.onclick = function(){alert('blah'); };
简短的回答:你想设置处理程序的function:
elemm.onclick = function() { alert('blah'); };
稍微长一点的答案:你将不得不编写更多的代码行,才能在浏览器中保持一致。
事实是,即使是在一系列普通浏览器上解决这个特定问题的细节更长的代码仍然会带来问题。 所以如果你不关心跨浏览器的支持,那就用完全短的一个。 如果你关心它,绝对只想得到这一个单一的东西工作,去与addEventListener
和attachEvent
的组合。 如果您希望能够在整个代码中广泛地创build对象并添加和删除事件侦听器,并希望在浏览器中工作,那么您一定要将这个职责委派给像jQuery这样的库。
我不认为你可以这样做。 你应该使用:
void addEventListener( in DOMString type, in EventListener listener, in boolean useCapture );
文档就在这里 。
你有三个不同的问题。 首先,应该引用HTML标记中的值! 不这样做可能会混淆浏览器,并可能导致一些麻烦(虽然可能不是这种情况)。 其次,您应该像其他人所说的那样,将一个函数实际分配给onclickvariables。 这不仅是继续前进的正确方法,而且如果您尝试在onclick函数中使用局部variables,则会变得更简单。 最后,您可以尝试addEventListener或jQuery,jQuery具有更好的界面的优点。
哦,并确保您的HTMLvalidation! 这可能是一个问题。
如果你不想写所有你曾经写过的函数的代码。 请使用下面的代码,使用jQuery:
$(element).on('click',function(){add_img();});