[求助]js如何监控地址栏中地址的变化

项目里用到这样的功能：
一旦地址栏中的地址发生变化就调用某个函数。
比如：
<html>
<head>
<title> test </title>
</head>
<body>
<a name="test1" /><a name="test2" /><a name="test3" /><a name="test4" /> <div id="info" style="width:300px;height:50px;border:1px solid #ddd;">the infomation field</div>
<a class="func" href="#test1">test1</a><br />
<a class="func" href="#test2">test2</a><br />
<a class="func" href="#test3">test3</a><br />
<a class="func" href="#test4">test4</a><br /><script type="text/javascript">
function getArgs (url)
{
var _url = "";
if (url)
{
_url = url;
}
else
{
var _url = window.location.href;
}
if (_url.split("#").length <= 1)
{
return "";
}
else
{
return _url.split("#")[1].split(".");
}
}
function reload (url)
{
document.getElementById("info").innerHTML = getArgs(url);
}
</script>
</body>
</html>
现在点击链接以后，页面没有刷新，但是地址栏的地址中的内容发生了变化
要求每次变化以后调用reload()函数。
请问大大们怎么实现。用下面的方法可以达到点击链接调用的目的
但是点浏览器后退按钮的时候没用
window.onload=function()
{
var links = document.getElementsByTagName("a");
for (var i=0; i<links.length; i++)
{
if (/(^|\s)func($|\s)/.test(links[i].className))
{
links[i].onclick = function (){reload(this.href)};
}
}
}

解决方案 »

  1.   

    忘了说了，在不用setInterval的前提下。
      

  2.   

    一旦地址栏中的地址发生变化就调用某个函数???-----没办法,,/(^|\s)func($|\s)/ 这个正则是什么???
      

  3.   

    className中有个func的才加onclick要解决的是浏览器后退按钮。
      

  4.   

    楼主给你个思路你试试~:-------
    页面的焦点：window.onfocus
    网页上的每个组件，元素都有onfocus事件，即焦点事件，包括网页本身。
    两个页面之间切换会激发网页的焦点事件，window.onfocus .例
    <javascript>
    window.onfocus=function (){alert("test");};
    </javascript>
    当两个网页切换时，含有上面方法的页面在获得焦点时会激发onfocus事件，弹出一提示框test-------
    还有window.onblur事件等等~
    你看看能不能在这些锚点上写onfocus函数来实现你想要的效果~,试试浏览器的前进与后退会不会把焦点从一个锚点移到另一个锚点的吧?
      

  5.   

    window.onload          在浏览器完成对象的装载后立即触发。 
    window.onbeforeunload  在页面将要被卸载前触发。 如果加2个事件呢
      

  6.   

    还是没找到锚点触发的事件,
    你不用setInterval是不希望页面一直那么循环,scroll不一定变化~那
    我觉得在网页上鼠标肯定在动的吧,没有谁有键盘操作下拉条的吧,
    要不写个
    document.onmousemove=reload;
    鼠标动一下这个就执行几十到上百次(其实现在的浏览器执行上万次也不会卡的);
    优点就是鼠标不动或者在其他页面的话这个页面很安静~缺点就是你点了浏览器的"后退",鼠标不拿进document还是没反应~
      

  7.   

    window.onbeforeunload=function(){...}
    这个事件调用那个函数呢？
      

  8.   


    window.onload=window.onbeforeunload=function() { var links = document.getElementsByTagName("a"); for (var i=0; i<links.length; i++) { if (/(^|\s)func($|\s)/.test(links[i].className)) { links[i].onclick = function (){reload(this.href)}; } } }
    这样不行？
      

  9.   

    document.onclick=function(){}
    判断下有没有改变不就可以了
      

  10.   

    你看这样可以吗？var oldLocation = location.href;
     setInterval(function() {
          if(location.href != oldLocation) {
               do your action
               oldLocation = location.href；
          }
      }, 1000);
      

  11.   

    没用哦，点浏览器按钮也不会触发document.click事件。
    我现在暂时用的就是这种办法，看一楼：在不用setInterval的前提下。
      

  12.   

    怎么可能，地址栏没有API给js，手动敲地址栏，程序无法得知。而程序改动地址栏如果不跳转的话，只能改变地址的“#”后的部分，这也是跨域js经常用的，一旦跳转就是令一页了，你只能通过unload事件来做一些附加处理。
      

  13.   

    Re 21楼：
    只需要改变#后面的部分就可以了，只要JS能根据#后面的变化作出相应反应。除了setInterval没有更好的办法了吗？
      

  14.   

    估计你是希望能有个监控回调函数，事实上，没有，开始已经说了，没有这样的api。
    像easyXDM这样的跨域库都是用setInterval来监控的。
      

  15.   

    我又想到一个解决后退问题的办法,在每个锚连接的函数中写window.open(),在锚点被点击的时候同时多了个动作就是在一个高宽全部为0的iframe中打开一个特定页,这个页面的onload与onbeforeunload写函数,去调用父窗口的函数中reload,也就是说把原来父窗口的函数搬这里来了, 浏览器的后退按钮是肯定要使这个iframe中的页面后退的!这我肯定.
    呵呵,这想法纯粹是冲着"后退按钮"来的,有些不登大雅之堂,与楼主共同期待精通锚点的高手出现!