问题描述
|
在我的页面中,我必须根据用途的操作动态地创建一些元素,例如,当用户单击按钮时,我将创建一个新的div,但是我想在该div中添加一个点击处理程序:
function createNewDiv(){
var str=\"<aid=\'na\'>xxx</a>\";
//add click handler to this a
var ele=document.getElementById(\"na\");
if(ele.attachEvent){
ele.attachEvent(\"onclick\",function(){xxxx});
}else if(ele.addEventListener){
ele.addEventListener(\"click\",function(){xxx},false);
}
document.getElementById(\"con\").innerHTML=\"s\";
}
当我运行此代码时,出现错误:
ele未定义。
也许是由于我使用
var ele=document.getElementById(\"na\")
html dom正在构建中,因此无法找到该元素。(我认为这就是为什么我们使用jquery.ready(xxx)的原因。
如果是这样,是否有任何使它起作用的想法?
我在应用程序中使用Prototype 1.4。
感谢所有的答案。
现在使用<a>
代替<div>
但是由于某种原因,我不能使用dom来构建我的元素,也就是说,我不能使用:
var div_n=document.createElement(\"a\");
a.id=\"na\";
......
相反,我必须使用:
var s=\"<a id=\'na\'>xxx</a>\";
//append this created link to the existed container
document.getElementById(\"con\").innerHTML=s;
//then how to add the click handler to the `a#na`?
解决方法
您想要进入
ele
的要素是什么?如果我理解您的问题,您想向正在创建的div
中添加事件,而div
具有id = nDiv
,那么为什么要尝试使用with10ѭ获得元素?如果您尝试将事件绑定到您创建的div,则可以通过以下方式进行操作:
function createNewDiv(){
var div = document.createElement(\'div\');
div.id = \'nDiv\';
//add click handler to this div
div.addEventListener(\"click\",function(){xxx},false);
div.innerHTML=\"s\";
}
如果您在绑定函数时遇到问题(我不这么认为),请尝试定义函数并将其绑定到click,方法是:
function foo(){xxx}
...
div.addEventListener(\"click\",foo,false);
...
请注意,绑定foo
函数时没有括号。
, 您可以改为使用DOM创建div。这样就可以立即添加事件处理程序。例:
function createNewDiv(){
var ele = document.createElement(\"div\");
div.setAttribute(\"id\",\"nDiv\");
// ...
document.getElementById(\"con\").appendChild( ele );
}
边注:
与innerHTML相比,使用DOM进行此操作还快得多,并且对标准的抱怨也更多。但是人们倾向于使用innerHTML,因为它更容易。
, var str=\"<div id=\"nDiv\">xxx</div>\"
在进一步研究之前,这是问题的一部分吗?我不确定它的作用,但是除非您转义使用引号,否则它是无效的。
无论如何,我不确定您的代码在做什么,但是您想要做的应该看起来像这样:
// Get a container element for wherever you\'re going to add these divs
var container = document.getElementById(\"con\");
function createDiv() {
var div = document.createElement(\"div\");
// assign properties to div
div.onclick = someFunction;
container.appendChild(div);
}
jsFiddle示例