Question

我正在尝试定位<div>，这是<li>函数的父<div>的下一个show_projectinfo()。我试过.next()，.closest()等等......没有运气，有什么想法吗？

该功能是，如果我点击a.more_info，则隐藏li.slider img ...我不知道它是否完全超出范围...这是一个重复的div所以我不能只使用ID。

标记：

    <li class="info">
        <a id="previous-slider"> < </a>
        <span>01/15</span>
        <a id="next-slider" href="javascript:void(0)"> > </a>  
        <a class="more_info" href="javascript:void(0)" onclick="show_projectinfo()">Info</a>
    </li>
    <li class="slider">
        <img src="img/horizontal.jpg" alt="horizontal" width="624" height="429">
    </li>

这是剧本：

    function show_projectinfo(){
        $(this).closest('.slider img').hide();
        $('.info_content').fadeIn();
    }

Answer 1

基本问题是你从onclick调用方法而不是用jquery绑定它。

在您使用它的方式中，this引用窗口而不是单击的元素。

function show_projectinfo(e){
    e.preventDefault();
    $(this).parent().next().find('img').hide();
    $('.info_content').fadeIn();
}

$(function(){
    $('.more_info').click(show_projectinfo);
});

并从html中删除onclick属性

如果您（虽然您不应）使用onclick属性，请将{{1>传递给它作为参数

this

和

function show_projectinfo(element){
    $( element ).parent().next().find('img').hide();
    $('.info_content').fadeIn();
}

Answer 2

尝试：

$(this).parent().next() // parent() should be the <li> then next() will get your next <li>

Answer 3

$('.more_info').click(function(e){
    e.preventDefault();
    $(this).parent().next().find('img').hide();
    $('.info_content').fadeIn();
});

Answer 4

而不是.closest使用.parent和.next，而是选择带有.find的img。

查看此jsFiddle：

$("a.more_info").bind("click", function(e){
    e.preventDefault();
    $(this).parent("li").next("li.slider").find("img").hide();
    $('.info_content').fadeIn();
    return false;
});

Answer 5

$('li').click( function (){
       var nextLi = $(this).closest('div').next().children('li:first-child').attr('id');
    console.log(nextLi);    
});

考虑以下标记：

<div id='div1'>
    <li id='1'>1</li>
    <li id='2'>2</li>
    <li id='3'>3</li>
</div>
<div id='div2'>
    <li id='4'>4</li>
    <li id='5'>5</li>
    <li id='6'>6</li>
</div>

您可以查看我的直播jsFiddle了解更多详情。

目标父母下一个div

5 个答案: