如何为JavaScript生成的文本框附加onclick事件？

我有一个包含文本框的表格行，它有一个显示JavaScript日历的onclick。。。我正在用textbox向表中添加行，但我不知道如何将onclick事件附加到JavaScript生成的textbox

<input  class="date_size_enquiry" type="text" autocomplete="off"
onclick="displayDatePicker('attendanceDateadd1');" size="21" readonly="readonly"    
maxlength="11" size="11"  name="attendanceDateadd1" id="attendanceDateadd1" 
value="" onblur="per_date()" onchange="fnloadHoliday(this.value);">

像这样：

var el = document.createElement('input');
...
el.onclick = function() {
    displayDatePicker('attendanceDateadd1');
};

---

顺便说一句：在DOM中小心区分大小写。这是

“onclick”

，而不是

“onclick”

，以您为例，我认为您希望这样做：

el.onclick = function() { displayDatePicker(el.id); };

唯一的技巧是了解为什么需要将

displayDatePicker

调用包装到

function（）{…}

code中。基本上，您需要为

onclick

属性分配一个函数，但是要做到这一点，您不能只执行

el.onclick=displayDatePicker（el.id）

因为这将告诉javascript执行

displayDatePicker

函数，并将结果分配给

onclick

处理程序，而不是分配函数调用本身。因此，为了解决这个问题，您创建了一个匿名函数，该函数依次调用您的

displayDatePicker

。希望有帮助。

HTML5/ES6方法：

var el = document.createElement('input')

[...]

el.addEventListener('click', function () {
  displayDatePicker('attendanceDateadd1')
})

---

我相信，动态附加事件不是跨浏览器的，所以您可能需要为不同的浏览器编写不同的代码。为此，我建议使用类似JQuery的JS库。使用JQuery，它就这么简单：

$（'#elementId'）。单击（function（）{/*在这里做你想做的事*/}）

@eyazici:OP使用的DOM操作策略是安全的，除了

setAttribute（）

@asah它不起作用

el.onClick=function（）{alert（el.id）；}

@chandru\u cp:不要在“onclick”中大写“c”。它是小写的“c”。请参阅我答案的最后一行。对不起，我的一个朋友使用了我的系统

el.onclick = function() { displayDatePicker(el.id); };

var el = document.createElement('input')

[...]

el.addEventListener('click', function () {
  displayDatePicker('attendanceDateadd1')
})