JavaScript DHTML/Window Browser/History
Содержание
A Browser History Count
<HTML>
<HEAD>
<TITLE>History Object</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function showCount() {
var histCount = window.history.length;
if (histCount > 5) {
alert("You have visited " + histCount + " pages so far.");
} else {
alert("You have been to " + histCount + " Web pages this session.")
}
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<INPUT TYPE="button" NAME="activity" VALUE="My Activity" onClick="showCount()">
</FORM>
</BODY>
</HTML>
Go Back to previous Page
<html>
<head>
<title>Go Back to previous Page</title>
<script language="javascript">
<!--
function NextPage() {
history.forward(1);
}
//-->
</script>
</head>
<body>
<a href="javascript:NextPage()">Forward</a><br>
</body>
</html>
Go Back to previous Page using number
<html>
<head>
<title>Go Back to previous Page</title>
<script language="javascript">
<!--
function PreviousPage() {
history.back(1);
}
//-->
</script>
</head>
<body bgcolor="#ffffff" text="#000000">
<a href="javascript:PreviousPage()">Back</a><br>
</body>
</html>
Go Back to some step
<html>
<head>
<title>Go Back # Chosen</title>
<script language="javascript">
<!--
function PreviousPage() {
var quantity = document.selection.number.value
window.history.back(quantity);
}
//-->
</script>
</head>
<body bgcolor="#ffffff" text="#000000">
<form name="selection">
<select name="number" onChange="PreviousPage()">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</form>
</body>
</html>
History "back()" Example
<html>
<body>
<script language="JavaScript">
function function1(){
history.back(1);
}
</script>
<input type="button" value="Go back" onclick="function1();">
</body>
</html>
History "forward()" Example
<html>
<body>
<script language="JavaScript">
function function1() {
history.forward();
}
</script>
<a href="http://www.wbex.ru">Open a new document to build the history object</a>
<input type="button" value="Go forward" onclick="function1();">
</body>
</html>
Methods and Properties of the History Object
Type Item Description
Method back() Loads the last URL in the history list.
forward() Loads the next URL in the history list,
assuming you have gone back at some point.
go() Loads a URL from the history list by using the offset passed.
Property
current Refers to the current URL in the history list.
length Returns the number of entries in the history list.
next Refers to the next URL in the history list.
previous Refers to the previous URL in the history list.
Use history back button
<HTML>
<HEAD>
<TITLE>onBeforeUnload Event Handler</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function verifyClose() {
event.returnValue = "We really like you and hope you will stay longer.";
}
window.onbeforeunload = verifyClose;
</SCRIPT>
</HEAD>
<BODY>
<H1>onBeforeUnload Event Handler</H1>
<HR>
<P>Use this button to navigate to the previous page:
<BUTTON ID="go" onClick="history.back()">
Go Back
</BUTTON>
</BODY>
</HTML>