打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
JavaScript and Frames, Part I: Forcing Frames
userphoto

2006.02.25

关注

JavaScript and Frames, Part I (3)

Forcing Frames

In the previous page, we showed you how to escape frames. Now we‘re going to teach you how to force frames. If your Web site is based on frames, and you don‘t want the user to be able to load an inner page in a full window, you can rebuild the frame-setting document when the user attempts to load such a page. First, take a look at the following HTML document:

<HTML>            <HEAD>            <TITLE>Canvas</TITLE>            </HEAD>            <FRAMESET COLS="200, *">            <FRAME SRC="frame1.html" NAME="leftcolumn">            <FRAMESET ROWS="100, *">            <FRAME SRC="frame2.html"  NAME="toprow">            <FRAME SRC="frame3.html" NAME="bottomrow">            </FRAMESET>            </FRAMESET>            </HTML>

 

This document is named canvas.html. The upper and left frames are used for navigation purposes, while the main frame displays the actual content of the site. canvas.html initially loads frame3.html as the content page, but other documents can be loaded in that frame as well. Let‘s assume the user loads a document named frame4.html in the main frame. Everything looks great. We now have a frame-setting document named canvas.html, and three child frames named frame1.html, frame2.html, and frame4.html.

But what happens if the user attempts to load frame4.html in a separate window? We need to force the frames. First, we‘ll add a simple script to the HEAD portion of each one of the inner documents (frame1.html, frame2.html, frame3.html, and frame4.html).

<SCRIPT LANGUAGE="JavaScript">            <!--            if (top.location.href.indexOf("canvas.html") == -1)            top.location.href = "canvas.html?pageURL&frameNum";            // -->            </SCRIPT>

 

frameNum needs to be replaced with the index of the target frame. Use 0 (the first frame) for frame1.html, 1 (the second frame) for frame2.html, and 2 (the third frame) for frame3.html and frame4.html. For example, in frame4.html the script would be:

<SCRIPT LANGUAGE="JavaScript">            <!--            if (top.location.href.indexOf("canvas.html") == -1)            top.location.href = "canvas.html?frame4.html&2";            // -->            </SCRIPT>

 

Now let‘s see the new version of canvas.html:

<HTML>            <HEAD>            <TITLE>Canvas</TITLE>            <SCRIPT LANGUAGE="JavaScript">            <!--            var ar0 = "frame1.html";            var ar1 = "frame2.html";            var ar2 = "frame3.html";            var str = location.search;            var pos = str.indexOf("&");            if (pos != -1) {            var num = str.substring(pos + 1, str.length);            window["ar" + num] = str.substring(1, pos);            }            // -->            </SCRIPT>            </HEAD>            <SCRIPT LANGUAGE="JavaScript">            <!--            document.write(            ‘<FRAMESET COLS="200, *">‘,            ‘<FRAME SRC="‘, ar0, ‘" NAME="leftcolumn">‘,            ‘<FRAMESET ROWS="100, *">‘,            ‘<FRAME SRC="‘, ar1, ‘" NAME="toprow">‘,            ‘<FRAME SRC="‘, ar2, ‘" NAME="bottomrow">‘,            ‘</FRAMESET>‘,            ‘</FRAMESET>‘            );            // -->            </SCRIPT>            </HTML>

 

We start by assigning the three default frames, frame1.html, frame2.html, and frame3.html to three variables, ar0, ar1, and ar3, respectively:

var ar0 = "frame1.html";            var ar1 = "frame2.html";            var ar2 = "frame3.html";

 

These three files are the the basis of the the frame set. Any subsequent change will be on top of these three initial frames. Then, we extract the location.search string:

var str = location.search;            

 

This string begins after the question mark at the URL. In the example above, we added a string to the canvas.html URL:

  top.location.href = "canvas.html?frame4.html&2";            

 

The string location.search will be equal to frame4.html&2 in this case. In order to find the frame number at the end of this string, we use the String‘s indexOf() method to get the &‘s position:

var pos = str.indexOf("&");

 

And we take the substring starting just after the &, and ending at the end of the URL:

  var num = str.substring(pos + 1, str.length);            

 

Now that we know both the frame number and the file name, we can assign the file to the frame:

  window["ar" + num] = str.substring(1, pos);

 

Go ahead and try loading one of the frames as a separate file. You‘ll find out that this is not possible. The whole frameset will be always forced.

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
常用的 Javascript 操作汇总 (七
使用 HTML5 canvas 绘制精美的图形
第一阶段复习~HTML5基础夯实
HTML 5 Canvas
JavaScript图形实例:SierPinski三角形
JavaScript图形实例:Levy曲线及其变形
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服