WebDeveloper.com �: Where Web Developers and Designers Learn How to Build Web Sites, Program in Java and JavaScript, and More!   
Web Developer Resource Directory WebDev Jobs
Animated GIFs
CSS Properties
HTML 4.01 Tags
Site Management
WD Forums

    Web Video
    Expression Web



    Forum, Blog, Wiki & CMS

 Site Management
    Domain Names
    Search Engines
    Website Reviews

 Web Development
  Business Issues

    Business Matters

    The Coffee Lounge
    Computer Issues

DR. WEBSITE: Using JavaScript To Choose A Web Page From a Dropdown List and Exit a Frame

By David Fiedler and Scott Clark

Dear Dr. Website®: I want to use the dropdown list described on the WebDeveloper.com Questions and Answers page (www.webdeveloper.com/library/qanda.html#dropdown), but I am using it within a frame, and I want it to exit the frames. How can I get the equivalent of TARGET="_top" to work in this script?

For those who haven't seen the example our reader is referring to, it is a JavaScript that enables a visitor to choose a Web page from a dropdown list. When the user clicks on a title in the dropdown list, the browser automatically loads the Web page he or she has clicked on. Here is the "before" code:

 <SCRIPT LANGUAGE="JavaScript"> <!-- function doArray() { var arylnth = doArray.arguments.length; for ( i = 0 ; i < arylnth ; i++ ) { this[i]=doArray.arguments[i] } } function newpage() { var choose = eval(document.dropdown.site.selectedIndex); if( (choose > 0) && (choose < 12) ) { var section=new doArray( '', 'http://www.webdeveloper.com/index.html', 'http://www.webdeveloper.com/library/', 'http://www.webdeveloper.com/library/ reference.html', 'http://www.internetnews.com/wd-news/', 'http://www.webdeveloper.com/reviews/', 'http://www.webdeveloper.com/devforum/'); location=section[document.dropdown.site.selectedIndex]; } } //--> </SCRIPT> 
Here is the HTML source for the dropdown:
 <FORM NAME="dropdown"> <SELECT NAME="site" onChange='newpage();' ALIGN="left"> <OPTION SELECTED>Select a Web Developer® Section <OPTION>Main page <OPTION>DoIt Library <OPTION>Reference <OPTION>Web Developer® News <OPTION>Reviews <OPTION>Developer's Forum </SELECT> </FORM> To load the new page within the entire browser window, you would replace location with top.location, i.e.: top.location=section[document.dropdown.site.selectedIndex]; 
or if you wanted to load the new page into a different frame entirely, you would refer to that frame by its name--i.e., top.framename.location.

Webdeveloper.com's Home Page


Keywords: html, java
Date: 19971201

HTML5 Development Center

Recent Articles