Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/463.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
如何判断页面是否已跳转到javascript中的锚(#)?_Javascript_Jquery_Dom_Javascript Events - Fatal编程技术网

如何判断页面是否已跳转到javascript中的锚(#)?

如何判断页面是否已跳转到javascript中的锚(#)?,javascript,jquery,dom,javascript-events,Javascript,Jquery,Dom,Javascript Events,我有一些javascript可以出现在许多不同的页面上。有时,这些页面通过包含锚引用的URL访问(例如,comment-100)。在这种情况下,我希望javascript延迟执行,直到窗口跳转之后。现在我只是用了一个延迟,但这是相当不礼貌的,显然不是在所有情况下都有效。我似乎找不到任何与窗口“跳转”对应的DOM事件 除了简单的延迟之外,我提出的唯一解决方案是让JS在URL中查找锚,如果找到锚,请注意scrollTop中的更改。但这似乎有问题,而且我不能100%确定我的脚本是否总是在滚动发生之前被

我有一些javascript可以出现在许多不同的页面上。有时,这些页面通过包含锚引用的URL访问(例如,comment-100)。在这种情况下,我希望javascript延迟执行,直到窗口跳转之后。现在我只是用了一个延迟,但这是相当不礼貌的,显然不是在所有情况下都有效。我似乎找不到任何与窗口“跳转”对应的DOM事件

除了简单的延迟之外,我提出的唯一解决方案是让JS在URL中查找锚,如果找到锚,请注意scrollTop中的更改。但这似乎有问题,而且我不能100%确定我的脚本是否总是在滚动发生之前被触发,因此只有当用户手动滚动页面时,脚本才会运行。无论如何,我并不真的喜欢这个解决方案,而是更喜欢事件驱动的解决方案。有什么建议吗

编辑以澄清:

我不想检测哈希值的变化。以以下为例:

  • Page index.php包含到post.php#comment-1的链接
  • 用户单击post.php#comment-1的链接
  • post.php#comment-1加载
  • $(文档)。准备开火
  • 不久之后,浏览器向下滚动到#comment-1

  • 我正在尝试可靠地检测第5步何时发生。

    您可以在现代浏览器中查看window.onhashchange。如果您想要交叉兼容,请查看

    此页面还提供了有关window.onhashchange的更多信息

    编辑:基本上用类似的链接约定替换所有锚点名称,然后使用.scrollTo处理滚动:

    $(document).ready(function () {
      // replace # with #_ in all links containing #
      $('a[href*=#]').each(function () {
          $(this).attr('href', $(this).attr('href').replace('#', '#_'));
      });
    
      // scrollTo if #_ found
      hashname = window.location.hash.replace('#_', '');
      // find element to scroll to (<a name=""> or anything with particular id)
      elem = $('a[name="' + hashname + '"],#' + hashname);
    
      if(elem) {
           $(document).scrollTo(elem, 800,{onAfter:function(){
            //put after scroll code here }});
      }
    });
    
    $(文档).ready(函数(){
    //在包含以下内容的所有链接中,将#替换为##
    $('a[href*=#]')。每个(函数(){
    $(this.attr('href',$(this.attr('href')).replace(';
    });
    //如果找到,则滚动至
    hashname=window.location.hash.replace(“#",”);
    //查找要滚动到的元素(了解更多信息。

    似乎可以使用。我刚刚测试了以下代码:

    <a name="end" />
    <script type="text/javascript">
        window.onscroll = function (e) {
            alert("scrolled");
    }
    </script>
    

    处理程序,但它在IE上滚动之前启动,似乎不适用于Chrome或Firefox。

    要检测元素何时出现在屏幕上,请使用插件:


    @Gilsham-如果窗口由于其他原因被滚动怎么办?是的,我想在运行代码一次后必须解除绑定,只需添加一行window.onscroll=null;在发出警报后,您还可以在页面加载后检查window.pageYOffset,如果超过0,则页面已向下滚动我知道什么时候检查pageYOffset。document ready启动得太早了。jquery的.scroll()处理程序可能是我见过的最可行的解决方案。我必须做一些测试。我担心竞争条件(我不能100%确定在每种情况下在每个浏览器上滚动之前启动document ready)但我可能会一瘸一拐地走到一起。@bryan-问题不是检测到散列更改,问题是在使用散列的情况下,检查窗口是否已滚动到正确的位置。@Peter Ajtai,Aaron:可能想使用.scrollTo jQ插件处理滚动。您可以使用onAfter参数运行函数ion呼叫。我必须看看。scrollTo是否可以处理初始页面加载在URL中有锚的情况。我有这样的印象。scrollTo仅在单击当前页面中锚的链接时处理滚动。不幸的是,scrollTo似乎无法处理这种情况,尽管我希望被证明是错误的!@A阿隆:实际上,$.scrollTo可以处理跨页链接。我在回答中编辑了一些代码,向您展示了我在说什么。
    $(document).ready()
    触发得太早了吗?
    $('#comment-1').appear(function() {
      $(this).text('scrolled');
    });