2011-10-06 67 views
1

我上具有控制面板和IFRAME一个简单的应用程序名.hta工作。IFRAME和后退/前进按钮

我加了前进和后退按钮,但他们似乎并没有工作。如果在下面的例子中链接“a”和“B”被点击时,前进和后退按钮没有做任何事情。

这是如何实现的?

test.hta 
=================================== 
<!DOCTYPE html> 
<html> 
<head> 
    <title>Back/Forward Buttons</title> 
    <hta:application id="test" applicationname="test" icon="res/icon.ico" showintaskbar="yes" singleinstance="yes"> 
</head> 
<body> 
    <div class="strip"> 
     <button onclick="output.history.back(); return false">Back</button> 
     <button onclick="output.history.forward(); return false">Forward</button> 
    </div> 

    <div id="iframe-wrap" class="iframe-container"> 
     <iframe id="output" name="output" src="a.html" width="100%" border="0" frameborder="no" scrolling="yes"></iframe> 
    </div> 
</body> 
</html> 

a.html 
=================================== 
<!DOCTYPE html> 
<html> 
    <head><title>A</title></head> 
    <body>PAGE A - <a href="b.html">Go to B</a></body> 
</html> 

b.html 
=================================== 
<!DOCTYPE html> 
<html> 
    <head><title>B</title></head> 
    <body>PAGE B - <a href="a.html">Go to A</a></body> 
</html> 

回答

0

我最后不得不手动使用以下跟踪的iFrame网页的变化:

var iFrameHistory = { 
     history : [], 
     pos  : 0, 
     ignore : false, 

     updateUI: function() { 
      var el; 

      // Enable/disable back button? 
      el = document.getElementById('back'); 
      if (iFrameHistory.pos === 1) 
       el.className = 'disabled'; 
      else 
       el.className = ''; 

      // Enable/disable forward button? 
      el = document.getElementById('forward'); 
      if (iFrameHistory.pos >= iFrameHistory.history.length) 
       el.className = 'disabled'; 
      else 
       el.className = ''; 
     }, 

     back: function() { 
      var newPos = Math.max(1, this.pos - 1); 
      if (newPos !== this.pos) { 
       this.pos = newPos; 
       this.ignore = true; 
       document.getElementById('output').src = this.history[ this.pos - 1 ]; 

       this.updateUI(); 
      } 
     }, 
     forward: function() { 
      var newPos = Math.min(this.history.length, this.pos + 1); 
      if (newPos !== this.pos) { 
       this.pos = newPos; 
       this.ignore = true; 
       document.getElementById('output').src = this.history[ this.pos - 1 ]; 

       this.updateUI(); 
      } 
     }, 
     reload: function() { 
      document.getElementById('output').contentWindow.location.reload(); 
     }, 
     onload: function() { 
      if (!this.ignore) { 
       var href = document.getElementById('output').contentWindow.location.href; 
       if (href !== this.history[ this.pos - 1 ]) { 
        this.history.splice(this.pos, this.history.length - this.pos); 
        this.history.push(href); 
        this.pos = this.history.length; 

        this.updateUI(); 
       } 
      } 
      else { 
       this.ignore = false; 
      } 
     } 
    }; 
0

尝试:

window.frames.output.history.forward(); 

window.frames.output.history.go(+1); 

也许更好的办法是使用的getElementById让你试图用历史的元素。

也有与历史上的iFrame的一些已知的跨浏览器的问题,但我不记得确切的时刻,但谷歌应该能回答你。

+0

这似乎并没有被任何为我工作 –