jQuery - 如果单击DIV中的文本

Question

我有一些DIV.在这些DIV中有一些文本,图像,标签......当需要点击文本时,我需要显示"警报".不是图像,不是其他标签,不是其他标签中的文本......只是DIV内的文本.如何用jQuery做到这一点？

jsFiddle例子.

HTML

<div style="background-color:PapayaWhip;">Some text. 
 <img src="http://ynternet.sk/test2/close_1.jpg" /> 
 <img src="http://ynternet.sk/test2/close_2.jpg" /> 
</div> 
<div style="background-color:Moccasin;">This are letters 
 <em>and this are not.</em> 
 Hello again!
</div> 
<div style="background-color:LightGoldenRodYellow;">
 <img src="http://ynternet.sk/test2/close_1.jpg" />
 <img src="http://ynternet.sk/test2/close_2.jpg" />
 Letters in new line.
 <img src="http://ynternet.sk/test2/close_1.jpg" />
 <img src="http://ynternet.sk/test2/close_2.jpg" /> 
</div> 
<div style="background-color:Wheat;">New letters in another line.</div>

CSS

div {
  padding:10px 0px 0px 20px;
  font-family:Verdana;
  height:40px;
}
em{
  color:red;
}

Answer 1

如果div那么检查源的类型然后它意味着它将由div直接包装文本.如果你想像那样包含模式标签,em你可以添加条件.

现场演示

$('div').click(function(evt){  
    if(evt.target.tagName == 'DIV')
        alert("div clicked");
});

Answer 2

你可以使用一些jQuery魔法并查看其中的子项div,但是我会在你的div中添加一个span或者label内部并给它一个类/ id:

<span class="letters">
  Letters in new line
</span>

$(".letters").click(function() {
    alert('Clicked');
});

http://jsfiddle.net/meNJu/

提供的小提琴展示了如何使用它children()以及上面提到的方法.

http://jsfiddle.net/meNJu/1/

演示使用类而不是ID.