Question

是否可以定义锚点以滚动到网址并在框架中设置变量？我尝试使用下面的代码，但这在Chrome中不起作用。我可以使用另一个分隔符而不是＆符号来使其工作吗？

<!doctype html>
<html>
  <head>
    <title>Scroll to anchor test</title>
  </head>
  <body>
    <p><a href="#bottom">Scroll to bottom</a> (works)</p>
    <p><a href="#bottom&test=testing">Scroll to bottom and include
      variable in the frament</a> (doesn't work)</p>
    <p style="margin-top: 2000px">Bottom of page</p>
    <p><a name="bottom">#bottom</a></p>
  </body>
</html>

JSFiddle上面的代码：http://jsfiddle.net/janaagaard/FHdQr/

Answer 1

正如#bottom&var=value之前所指出的那样。该页面将滚动到id="bottom&var=value"的元素。页面向下滚动而不重新加载。

?var=value#bottom将使用该变量重新加载页面，并在该新页面上滚动到id="bottom"的元素。如果您需要知道＆＃39; var＆＃39;的值，这非常有用。服务器上的变量，用于执行某些服务器端操作。例如。在PHP中，您会在value中看到值$_GET['var']。

如果您需要使用javascript更改某些内容并且由于这个原因想要更改变量，则应使用onclick事件（通过在线使用它或以其他方式将其绑定到元素）。通常你不想改变一个变量，而是在（无名）函数中做你需要做的任何事情。如果您想进行客户端操作，这非常有用。

编辑：我很快想添加。要执行服务器端操作，您无需重新加载页面。如果你需要那么查找ajax请求。这是通过javascript完成的。

Answer 2

否，既不能链接到锚点也不能使用片段存储变量。

我最后使用JavaScript滚动页面，使用此答案作为模板：https://stackoverflow.com/a/4801719/37147。

Answer 3

如果我是你，我会这样做：

<强>的javascript

function GetTop(ele){
        if (ele.offsetParent)
            return (ele.offsetTop + GetTop(ele.offsetParent));
        else
            return (ele.offsetTop);
    }

    function scrollToAnchor(id,offset){
        var aTop; 
        if(id=='0')
            aTop=0;
        else


    aTop = GetTop(document.getElementById(id));
        //40px to leave room for #title
    $('body, html').animate({scrollTop:aTop+offset},900); 
    //body for chrome/safari and html for ie/firefox/opera
}

将它放在ID orso旁边的HTML中：

onclick="scrollToAnchor('div name to scroll to', -10)"

-10表示他将在您要滚动到的位置上方或下方的像素。

是否可以滚动到锚点并在URL中的片段中定义变量？

3 个答案: