Javascript 将div链接到其中的href

我想将整个

人员容器

链接到其中的第一个href。（员工图片中的一个）。如何使用jQuery编写这个？我对

attr（）

非常困惑，我知道我必须使用它

在下面的HTML中，jQuery应该将

staff容器

链接到google.com

<div class="staff-container">
    <div class="staff">
        <div class="staff-picture">
            <a href="http://www.google.com/"><img src="img/people/teachers/ahmed.png" /></a>
        </div>
        <p><span class="bold">Mr. Ahmed</span><br />
        Ext. 13417<br />
        Room 417/323<br />
        <a href="mailto:email@wcskids.net">email@wcskids.net</a></p>
    </div>
</div>

如果

员工图片中没有链接

我不希望它链接电子邮件。如果jQuery在

员工图片中找不到链接，我希望单击什么也不做。
像这样试试

$('.staff-container').click(function(e) {

    if($(this).find('a').attr('href'))
        window.location.href = $(this).find('a').attr('href');       
    e.preventDafault();
});

像这样…？如果你特别想要第一个锚标签，那么你可以给

window.location.href = $(this).find('a').eq(0).attr('href');

像这样试试

$('.staff-container').click(function(e) {

    if($(this).find('a').attr('href'))
        window.location.href = $(this).find('a').attr('href');       
    e.preventDafault();
});

像这样…？如果你特别想要第一个锚标签，那么你可以给

window.location.href = $(this).find('a').eq(0).attr('href');

试试这个：

$('.staff-container').click(function() {
    var $first_link = $(this).find('a').first();
    window.location.href = $first_link.attr('href');
});

试试这个：

$('.staff-container').click(function() {
    var $first_link = $(this).find('a').first();
    window.location.href = $first_link.attr('href');
});

纯JS版本：应该比jQuery快一点

<script>
function link(loc){
    var href=loc.getElementsByTagName('a')[0].href;
    console.log(this);
    console.log(href);
    loc.setAttribute("onclick","window.location.href='"+href+"'");
    loc.removeAttribute("onmouseover","");
}
</script>
<div class="staff-container" onmouseover="link(this)">
    <div class="staff">
        <div class="staff-picture">
            <a href="http://www.google.com/"><img src="img/people/teachers/ahmed.png" /></a>
        </div>
        <p><span class="bold">Mr. Ahmed</span><br />
        Ext. 13417<br />
        Room 417/323<br />
        <a href="mailto:email@wcskids.net">email@wcskids.net</a></p>
    </div>
</div>


功能链接（loc）{
var href=loc.getElementsByTagName（'a'）[0].href；
console.log（this）；
console.log（href）；
loc.setAttribute（“onclick”，“window.location.href=”“+href+””）；
位置removeAttribute（“onmouseover”，“onmouseover”）；
}
艾哈迈德先生

分机13417

417/323房间



工作测试
纯JS版本：应该比jQuery快一点

<script>
function link(loc){
    var href=loc.getElementsByTagName('a')[0].href;
    console.log(this);
    console.log(href);
    loc.setAttribute("onclick","window.location.href='"+href+"'");
    loc.removeAttribute("onmouseover","");
}
</script>
<div class="staff-container" onmouseover="link(this)">
    <div class="staff">
        <div class="staff-picture">
            <a href="http://www.google.com/"><img src="img/people/teachers/ahmed.png" /></a>
        </div>
        <p><span class="bold">Mr. Ahmed</span><br />
        Ext. 13417<br />
        Room 417/323<br />
        <a href="mailto:email@wcskids.net">email@wcskids.net</a></p>
    </div>
</div>


功能链接（loc）{
var href=loc.getElementsByTagName（'a'）[0].href；
console.log（this）；
console.log（href）；
loc.setAttribute（“onclick”，“window.location.href=”“+href+””）；
位置removeAttribute（“onmouseover”，“onmouseover”）；
}
艾哈迈德先生

分机13417

417/323房间



工作测试
@Brett Merrifield它对你有用吗..？我仍然在与电子邮件链接，其中的邮件在.staff图片中没有链接。但是我把if（$（this.find（'a'）.attr（'href'））改为if（$（this.find（'staff picture a'）.attr（'href'）），效果非常好！thanks@Brett梅里菲尔德：它对你有用吗？..我仍然可以在员工图片中没有链接的邮件上找到链接。但是我把if（$（this.find（'a'）.attr（'href'））改为if（$（this.find（'staff picture a'）.attr（'href'）），效果非常好！谢谢