Question

<div id="main_div" style="border:1px solid black;height:20%;width:40%;">
  <div id="first">first div<div>
  <div id="second">second div</div>
  <input id="third" type="text" value=""/>
</div>

我想要的是，当我点击main_div的子元素时，我想得到那里的id，当我点击作为父元素的main_div时，我可以通过使用单击功能获得其id。而约束是我不能给父元素和子元素赋予一些类。

Answer 1

类似的东西：

$('#main_div').on('click', function(e){
   alert(e.target.id);
});

for jQuery＆lt; 1.7使用

$('#main_div').click(function(e){
   alert(e.target.id);
});

在这里摆弄http://jsfiddle.net/7TXjF/

Answer 2

由于您的问题有一个jquery标记，我将以jquery答案回复。

$("#main_div").click(function(e) {
    alert($(e.target).attr("id"));
});

另见小提琴：http://jsfiddle.net/wEPHh/1/

Answer 3

这应该可以解决问题......

$('#main_div,#first,#second,#third').click(function(){
    console.log(this.id);
});

Answer 4

尝试 -

$("div").click(function(event) {
   alert(this.id);
   event.stopPropagation();        
});

这应警告您点击的任何div的ID，但调用event.stopPropagation()将阻止事件冒泡到任何父div。

工作演示 - http://jsfiddle.net/CVLCb/

Answer 5

来自this answer，你可以这样做：

$('div').click(function(evt){
  var currentID = this.id || "No ID!";
  alert(currentID);
})

这将显示单击的div的ID。

单击父和子ID的功能

5 个答案: