Question

我有一个导航栏下拉菜单，其中列出了存储在数据库中的事件标题。我试图允许用户单击其中一个链接并将页面带到单击的指定事件。问题是目标事件是由数据库动态创建的。

我相信我遇到了并发问题，因为没有完成抓取事件并动态创建它的ajax请求。有没有办法链接到页面并等待从数据库创建事件并向下滚动到对象div。

以下是导航栏中的一个链接：

<a href="events.php#2">The Choice </a>

这是events.php页面上的目标div：

<div id='2'>Dynamic content</div>

我可以用Javascript或PHP做些什么来等待加载吗？也许通过访问一个隐藏的div来激活一个函数然后该函数将滚动到div？

Answer 1

由于页面不会在加载时滚动，因为div不存在，所以当它存在时滚动到它。这可能发生在ajax查询的成功，所以当发生这种情况时，将页面向下滚动到新的div。

示例：

$.ajax({
  url: "test.html"
  //whatever this ajax is supposed to do.
}).success(function() {
  //make the new div
  $('body').append('<div id="newDiv></div>')
  //scroll to the new div
  $('html, body').animate({
    // window.location.hash is the div you want to scroll to as set by the link on the other page, and it even comes pre hashed ("#whatever").
    scrollTop: $(window.location.hash).offset().top
  }, 2000);
});

链接到另一页上的动态创建的div

1 个答案: