首页 新闻 论坛 群组 Blog 文档 下载 读书 Tag 网摘 搜索 开源 FAQ 第二书店 博文视点 程序员
频道: 研发 数据库 中间件 信息化 视频 .NET Java 游戏 移动 服务: 人才 外包 培训
    图书品种:235680
       
热门搜索: ASP.NET Ajax Spring Hibernate Java

4.6  实践练习:创建“后退”和“前进”按钮

可以使用history对象的back和forward方法在Web文档中添加你自己的“后退”和“前进”按钮。当然,浏览器已经有了“后退”和“前进”按钮,但有时候这它可用来指向特定的链接。

现在创建一个脚本,来显示“后退”和“前进”按钮,并使用这些方法为浏览器导航。下面是创建“后退”按钮的代码:

<input type="button"

    onClick="history.back();" value="<-- Back">

<input>标签定义了一个标识为Back的按钮。OnClick事件处理器使用了history.back()方法,进入历史的前一个页面。“前进”按钮的代码与此类似:

<input type="button"

    onClick="history.forward();" value="Forward -->">

除了这些,还需建立HTML的其余部分。程序清单4.2显示了完整的HTML文档,图4.2是该文档在浏览器中的显示画面。在将这个文档载入到浏览器之后,访问其他的网址并确认一下“后退”和“前进”按钮是否正常工作。

程序清单4.2  一个使用JavaScript制作包含“后退”和“前进”按钮的Web页面

<html>

<head><title>Back and Forward Buttons</title>

</head>

<body>

<h1>Back and Forward Buttons</h1>

<p>This page allows you to go back or forward to pages in the history list.

These should be equivalent to the back and forward arrow buttons in the

browser’s toolbar.</p>

<p>

<input type="button"

    onClick="history.back();" value="<-- Back">

<input type="button"

    onClick="history.forward();" value="Forward -->">

</p>

</body>

</html>

图4.2

Internet Explorer中的“后退”和“前进”按钮

查看所有评论(0)条】

最近评论



正在载入评论列表...
热点评论