使用javascript在div标签上添加click事件

Question

div我的表格中有一个没有id属性的标签.我需要on-click在这个div标签上设置一个事件.

我的HTML代码:

<div class="drill_cursor" >
....
</div>

我不想id在我的div标签中添加属性.

如何on-click使用Javascript在此标记上添加事件？

Answer 1

Evg*_*nov 33

试试这个:

 var div = document.getElementsByClassName('drill_cursor')[0];

 div.addEventListener('click', function (event) {
     alert('Hi!');
 });

Answer 2

document.getElementsByClassName('drill_cursor')[0]
        .addEventListener('click', function (event) {
            // do something
        });

$(".drill_cursor").click(function(){
//do something
});

Answer 3

只需添加onclick-attribute:

<div class="drill_cursor" onclick='alert("youClickedMe!");'>
....
</div>

它是javascript,但它会自动使用html属性绑定,而不是在<script>标签内手动绑定它- 也许它可以满足您的需求.

虽然对于非常小的项目或测试页面来说它可能已经足够好了addEventListener,但如果您期望代码增长并保持可维护性,那么您应该明确考虑使用(正如其他答案所指出的那样).

这是JavaScript!这是内联JavaScript代码,它确实被广泛采用的不良做法.调试和维护代码很困难,代码放在html文档的各个位置.我建议使用事件处理程序. (5认同)

Answer 4

建议您使用Id，因为Id仅与一个元素相关联，而类名可能链接到多个元素，导致混淆了向该元素添加事件的过程。

如果您真的想使用类，请尝试：

 document.getElementsByClassName('drill_cursor')[0].onclick = function(){alert('1');};

或者您可以在html本身中分配功能：

<div class="drill_cursor" onclick='alert("1");'>
</div>