分类:
2008-04-14 15:49:43
<html> <head> <title></title> </head> <body> <div id="historybuttons"></div> <div> <a href="#" onclick="do_add(); return false;">Add Random Resource</a> </div> <div id="output" style="margin-top:40px;"></div> </body> </html> |
<script type="text/javascript" src="history.js"></script> <script type="text/javascript"> var myHistory = new HistoryStack(); myHistory.load(); function do_add() { var num = Math.round(Math.random() * 1000); myHistory.addResource(num); display(); return false; } function do_back() { myHistory.go(-1); display(); } function do_forward() { myHistory.go(1); display(); } function do_reload() { myHistory.go(0); } function display() { // Display history buttons var str = ''; if (myHistory.hasPrev()) { str += '<a href="#" onclick="do_back(); return false;">' + '<img src="icons/back_on.gif" alt="Back" /></a> '; } else { str += '<img src="icons/back_off.gif" alt="" /> '; } if (myHistory.hasNext()) { str += '<a href="#" onclick="do_forward(); return false;">' + '<img src="icons/forward_on.gif" alt="Forward" />' + '</a> '; } else { str += '<img src="icons/forward_off.gif" alt="" /> '; } str += '<a href="#" onclick="do_reload(); return false;">' + '<img src="icons/reload.gif" alt="Reload" /></a>'; document.getElementById("historybuttons").innerHTML = str; // Display the current history stack, highlighting the current // position. var str = '<div>History:</div>'; for (i=0; i < myHistory.stack.length; i++) { if (i == myHistory.current) { str += '<div><b>' + myHistory.stack[i] + '</b></div>'; } else { str += '<div>' + myHistory.stack[i] + '</div>'; } } document.getElementById("output").innerHTML = str; } window.onload = function () { display(); }; </script> |
图 2. 历史堆栈的测试页面 |
<div id="historybuttons"></div> |
<script type="text/javascript" src="history.js"></script> |
var myHistory = new HistoryStack(); myHistory.load(); |