JavaScript dropdown list menu to switch any page
In this article we are going to design a JavaScript dropdown list menu to switch any page. Some time we have provided option to Select a desire option and load that a web page with respect to it. The Script we are going to design is very simple. First of all just design a select menu. All we have to do is design a form and a drop-down list box. Following piece of code will do it for you.
<form method="post">
<select name="url" onchange="switchpage(this)">
<option value="http://www.xfunda.com">Xfunda Home</option>
<option value="" selected="selected">Redirect to...</option>
<option value="http://www.xfunda.com/forum">Xfunda Forums</option>
<option value="http://www.tipsntracks.com">.Net Tips n Tracks</option>
</select>
</form>
As the user select any option from the list box. The onchange event triggers the switchpage(this) function which gets called with the index of the drop-down list box. switchpage() is the function which will take care of switching to any page. Now we define switchpage(this).
<script language="javascript" type="text/javascript">
function switchpage(select) {
var index;
for(index=0; index<select.options.length; index++)
if(select.options[index].selected)
{
if(select.options[index].value!="")
window.location.href=select.options[index].value;
break;
}
}
</script>
example:
Take a look on live demo...Source Code:
Download Source code for 'JavaScript dropdown list menu to switch any page'
Download
TrackBack URI for this entry
Subscribe to this comment's feed
written by rupesh, January 09, 2009
written by Chetankumar Akarte, January 10, 2009
you can use following code to reduce size...
Regards
Chetankumar Akarte
http://www.xfunda.com
written by Chetankumar Akarte, March 13, 2009
Following piece of code will do it for you.
newWindow = window.open(select.options[index].value);
newWindow.focus( );
Regards
Chetankumar Akarte
http://www.xfunda.com
written by Vagelis, March 13, 2009
