Question

我有以下代码

<ul id="menu">
    <li class="newsPara">
    Initial copy here   
    <a href="#" class="readmore">Read more&raquo; </a>
        <ul class="accordianUl" style="display: none">
            <li>
            content hidden here
            </li>
        </ul>
    </li>
</ul>

当用户点击阅读时，子ul会扩展。使用以下代码

$('#menu li a').click(function () {
    $('#menu li a').show();
    $(this).hide();
    var checkElement = $(this).next('ul');
    if (checkElement.is(':visible')) {
        return false;
    }
    if (!checkElement.is(':visible')) {
        $('#menu ul:visible').slideUp('normal');
        checkElement.slideDown('normal');
        $('html, body').animate({ scrollTop: $(this).parent('.accordianUl').position().top }, 'slow'); 
        return false;
    }
});

我希望一旦sub ul扩展到跳到顶部我已经尝试过这个

$('html, body').animate({ scrollTop: $(this).parent('.accordianUl').position().top }, 'slow');

但它似乎无法正常工作

任何人都可以提供帮助

感谢

Answer 1

你的$(this).parent()返回null，因为它没有一个accordianUl。 $（this）指的是调用函数的当前元素，请看这个小提琴：

http://jsfiddle.net/jFIT/wfeWW/

$('#menu li a').click(function () {
  $('#menu li a').show();
  $(this).hide();
  $this = $(this);     //KEEP THAT ELEMENT JUST INCASE
  console.log($this);    //IT IS THE LI > A
  var checkElement = $(this).next('ul');
  if (checkElement.is(':visible')) {
    return false;
  }
  if (!checkElement.is(':visible')) {
    $('#menu ul:visible').slideUp('normal');
    checkElement.slideDown('normal');
    $('html, body').animate({ scrollTop: checkElement.position().top }, 'slow'); 
    return false;
  }
});

一旦扩展，跳到div的顶部

1 个答案: