Question

可能重复：
Getting a parent element for a jquery selector

我有一个项目清单：

        <div id="wrap"><ul class="thumbs noscript">
        <li id="1">
        <a class="thumb" href="photos/10-01.jpg" title="" />
        <img src="photos/10-01_thumb.jpg" alt="" />
        </a>
        <div class="caption">
        <div class="download"><a href="#" class="add2cart">Save Image</a></div>
        <div class="image-title">Titre de la photo #1</div>
        <div class="image-desc">Description de la photo #1</div>
        </div>
        </li> /* and so on with li's and different ID's... */

我无法获得li ID的值，因此，标题。在这里阅读并尝试了几乎所有的答案，一旦我在我的网站上测试它们就无法工作了...... 任何的想法？ TY伙计

$(document).ready(function(){
    $("#wrap > ul > li > .caption > .download > .add2cart").click(function(){
        var thisID = $(this).closest('li').attr("id");
        alert(thisID);
    });
});

正确的回答（见下文）：失眠，暴力还要感谢Diodeus指出ID问题。感谢所有回答的人;）

Answer 1

使用“data”api存储值，然后点击检索该值而不是使用id。

<li id="img" data-val="1">
            <a class="thumb" href="photos/10-01.jpg" title="" />
            <img src="photos/10-01_thumb.jpg" alt="" />
            </a>
            <div class="caption">
            <div class="download"><a href="#" class="add2cart">Save Image</a></div>
            <div class="image-title">Titre de la photo #1</div>
            <div class="image-desc">Description de la photo #1</div>
            </div>
    </li> /* and so on with li's and different ID's... */

jquery：

    $(document).ready(function(){
        // if you want the value of li, using the child click.
        // Do something like this, if you want the click on "thumb".
        $('.thumb').click(function(e){
             e.preventDefault();
            var val = $(this).closest('li').data('val');
         });

     });

适用于jsfiddle

更新您的js代码：

$(document).ready(function(){
    $(".add2cart").click(function(e){
        e.preventDefault();
        // Use prop if your jquery version is above 1.6.. 
        var thisID = $(this).closest('li').prop("id");
        alert(thisID);
    });
});

注意：从jQuery 1.6开始，.attr（）方法为尚未设置的属性返回undefined。此外，.attr（）不应用于普通对象，数组，窗口或文档。要检索和更改DOM属性，请使用.prop（）方法。

Answer 2

对于您的特定情况，您可以使用$(this).parent().attr('id')：

$('li a').on('click', function () {
   alert('you clicked a link within a li with id=' + $(this).parent().attr('id')); 
   } 
);

http://jsfiddle.net/8QZ2s/

Answer 3

您也可以使用.closest

$(this).closest('li').attr('id');

如果您的控件进一步嵌套，这将确保它实际上找到li而不是另一个父元素。

如何通过单击子链接获取父LI的值？

3 个答案: