Question

我有以下列表： -

    <div id="main-links-bottom-hover">

        <div id="About" class="hovers">

            <div id="main-about-div">

                <li class="lnk1 about-lnk"><a href="contact.php">Contact</a></li>
                <li class="lnk2 about-lnk"><a href="technology.php">Technology</a></li>
                <li class="lnk3 about-lnk"><a href="environment.php">Environment</a></li>
                <li class="lnk4 about-lnk"><a href="terms.php">T&amp;C's</a></li>
                <li class="lnk5 about-lnk"><a href="pricing.php">Pricing Policy</a></li>

            </div>

        </div>

    </div>

对于每个<li>我想设置li以打开最近的<a href>。

我试过了： -

    $('li').each(function(){
        var linkitem = $('.lnk1 a', this).attr('href');
        $('a.lnk1', this).attr('href' , linkitem) 
    });

但这似乎没有用，有什么建议吗？

ADDED CSS： -

#main-about-div {
    position:absolute;
    top:5px;
    left:5px;
}

.lnk1, .lnk2, .lnk3, .lnk4, .lnk5, .lnk6 {
    list-style-type: none;
    font-size:13px;
    margin-bottom:5px;
    margin-top:-5px;
    width:140px;
    height:30px;
    margin-left:-5px;
    cursor:pointer;
    border-bottom:1px dotted #1f5779;
}

.lnk1 a {
    position:absolute;
    top:-2px;
    left:5px;
    color:#FFF;
}

.lnk2 a {
    position:absolute;
    top:30px;
    left:5px;
    color:#FFF;
}

.lnk3 a {
    position:absolute;
    top:61px;
    left:5px;
    color:#FFF;
}

.lnk4 a {
    position:absolute;
    top:92px;
    left:5px;
    color:#FFF;
}

.lnk5 a {
    position:absolute;
    top:124px;
    left:5px;
    color:#FFF;
}

.lnk6 a {
    position:absolute;
    top:156px;
    left:5px;
    color:#FFF;
}

Answer 1

这样做：

#main-about-div a {
    display: block
}

由于你的LI元素每个只包含一个A元素，如果你使A元素成为块级别，它们应占用其父元素的整个空间，然后单击LI元素将自动表示相应的还点击了一个元素。

更新：看到您的CSS代码后。

#main-about-div li {
    list-style-type: none;
    font-size:13px;
    border-bottom:1px dotted #1f5779;
}
#main-about-div a {
    display: block;
    width: 140px;
    height: 30px;
    background: pink;
}

现场演示： http://jsfiddle.net/simevidas/reSE8/（使用normalized CSS）

注意A元素现在是如何阻塞的，并且在它们上设置尺寸而不是LI元素。

Answer 2

这可能有所帮助！

$（ '礼'）。每个（函数（）{

    p = $(this).find('a');
    $(p).attr('href','Not sure what you are trying to do but your custom href goes here');

});

查找最近的<a> link with jQuery</a>

2 个答案: