jQuery可点击div与内部工作mailto链接

Question

我有一个div,我想要点击,但我需要在div内部的mailto链接仍然可以工作.当我将鼠标悬停在mailto链接上时,mailto会出现在浏览器的底部,但是单击会激活附加到div的链接.无论如何围绕这个？谢谢.

<div class="directory_search_results">
<img src="images/no_photo.png" />   
<ul class="staff_details">
<li class="search_results_name"><a href="http://www.netflix.com">Micheal Staff</a></li>
<li class="search_results_location">University of Illinois</li>
<li class="search_results_email"><a href="mailto:test@test.org">test@test.com</a></li>
    <li class="search_results_phone">(407) 555-1212</li>
    <li class="search_results_office">(407) 555-1212</li>
</ul></div>

现在是jQuery

$(document).ready(function(){       
$(".directory_search_results").click(function(){
         window.location=$(this).find("a:first-child").attr("href");
         return false;
});

Answer 1

在mailto中添加一个类:链接如下:

<div class="directory_search_results">
<img src="images/no_photo.png" />   
<ul class="staff_details">
<li class="search_results_name"><a href="http://www.netflix.com">Micheal Staff</a></li>
<li class="search_results_location">University of Illinois</li>
<li class="search_results_email"><a class="nobubble" href="mailto:test@test.org">test@test.com</a></li>
    <li class="search_results_phone">(407) 555-1212</li>
    <li class="search_results_office">(407) 555-1212</li>
</ul></div>

并添加以下jQuery代码

$('.nobubble').click(function(event){
    event.stopImmediatePropagation();
});

这将防止事件冒泡到父div触发点击那里.