Pilihan Dinamik 
Actual Links: 

Copy skrip atau download.
 
<!-- This script has been in the http://www.javascripts.com Javascript Public Library! --> 
<!-- Note that though this material may have been in a public depository, certain author copyright restrictions may apply. --> 
<html> 
<head> 
<title>Dynamic Select Menus</title> 
<SCRIPT language="javascript"> 
<!-- hide jscript from old browsers --- 

function refresh_screen() 

     window.location.reload() 

/****** this object holds all of the key data **********/ 
function Link(name, url) 

        this.name = name; 
        this.title = new Array(); 
        this.url = new Array(); 

/**************************************************************/ 
var names      = new Array (); 
var temp       = new Array (); 
var temp2               = new Array (); 
var link       = new Link (); 
var final_list = new Array (); 
/******** array declaration... it holds all of the data for the menus ****/ 
var menu = new Array ( 
"Javascript*http://www.radix.net/~jtd/test30/java1.htm|Java Page#" + 
        "http://ds.dial.pipex.com/town/avenue/xio12/wax/|HOT WAX#" + 
        "http://www.wsabstract.com/cutpastejava.htm|Website Abstraction Free JavaScripts!#" + 
        "http://www.webteacher.com/javatour/framehol.htm|JavaScript for the Total Non-Programmer#" + 
        "http://www.developer.com/directories/pages/dir.javascript.html/|Developer.com#" + 
        "http://javascriptsource.com/|The JavaScript Source#" + 
        "http://members.aol.com/MHall75819/index.html|Advanced Webpage Design#" + 
        "http://www.coolnerds.com/webauth/jscript/Default.htm|Coolnerds - A Webhead's Wonderland#" + 
        "http://med-amsa.bu.edu/server/js/|JavaScript Reference Manual#" + 
        "http://www.loran.com/reference/javascript-ref/contents.htm|JavaScript Reference#" + 
        "http://developer.netscape.com/docs/manuals/communicator/jsguide4/index.htm|JavaScript Guide#" + 
        "http://www.javascriptg.com/completelisting.html|Welcome! - JavaScript Galore#" + 
        "http://www.infohiway.com/javascript/indexf.htm|Cut-N-Paste JavaScript#" + 
        "http://www.jsworld.com/|JavaScript World --> Welcome!#" + 
        "http://www.webconn.com/java/javascript/intro/|Voodoo's Intro to JavaScript#" + 
        "http://geocities.datacellar.net/SiliconValley/7116/|The JavaScript Planet#" + 
        "http://www.hotwired.com/webmonkey/javascript/?tw=javascript|Webmonkey: javascript collection#" + 
        "http://www.macad.org/referral/sair2/jsrefsrc.html|MACAD's SAIR -- JavaScript Database", 
"Search Engines*http://home.netscape.com/home/internet-search.html|Netscape Search#" + 
        "http://www.excite.com|Excite#http://www.infoseek.com|Infoseek#"+ 
        "http://www.lycos.com|Lycos#http://www.yahoo.com|Yahoo!#" + 
        "http://www.inference.com/|Inference Corporation Home Page", 
"Computers and Technology*http://www.atvantage.com/usrbin/atvantage|@vantage#" + 
        "http://www.bonzi.com/netscape/voicenet.htm|BONZI Voice Email#" + 
        "http://www.techweb.com/|CMP TechWeb#" + 
        "http://www.pcmag.com|PC Magazine Online#" + 
        "http://www.wired.com/news/|Wired News", 
"General News*http://www.abcnews.com|ABCNEWS.com#" + 
        "http://www.cnn.com|CNN Interactive#" + 
        "http://www.nytimes.com|The New York Times on the Web#" + 
        "http://www.usatoday.com|USA Today#" + 
        "http://www.abcnews.com/weather/OLM.html|ABCNews.com AccuWeather", 
"Shopping*http://www.amazon.com/|Amazon.com Bookstore#" + 
        "http://www.catalogsite.com/|Catalog Site#" + 
        "http://www.cdnow.com|CDnow#" + 
        "http://www.sharperimage.com|The Sharper Image Catalog#" + 
        "http://www.surplusdirect.com|Surplus Direct#" + 
        "http://www.onsale.com|Welcome to ONSALE!", 
"Shareware/Freeware*http://hotfiles.zdnet.com/|ZDNet Software Library#" + 
        "http://tucows.holler.net/|Welcome to TUCOWS#" + 
        "http://www.shareware.com/|Shareware.com", 
"Graphics*http://www.lysator.liu.se/lothlorien/lothlorien.html|Lothlorien, Amateur fantasy art gallery#" + 
        "http://www.ssanimation.com/|Entering SS Animation...#" + 
        "http://www.enchantress.net/fantasy/index.shtml|Fantasyland Graphics"); 
/*****************************************************************/ 
function updateMenus ( what ) { 
   var n = what.selectedIndex; 
   what.form.myLinks.length = final_list[n].title.length; 
   for (var x = 0; x < what.form.myLinks.length; x++) 
   { 
      what.form.myLinks.options[x].text = final_list[n].title[x]; 
      what.form.myLinks.options[x].value = final_list[n].url[x]; 
   } 
   what.form.myLinks.selectedIndex = 0; 

/**************************************************************/ 
function give_names () 

        document.myForm.main.length = names.length; 
        document.myForm.myLinks.length = final_list[0].title.length; 
        for ( var i=0; i<names.length; i++ ) 
                document.myForm.main.options[i].text = final_list[i].name; 
        for (var x=0; x<final_list[0].url.length; x++) 
                document.myForm.myLinks.options[x].value = final_list[0].url[x]; 
        for (var x=0; x<final_list[0].title.length; x++) 
                document.myForm.myLinks.options[x].text = final_list[0].title[x]; 


/**************************************************************/ 
function createMenus () { 

        for ( var i=0; i < menu.length; i++ ) 
        { 
                names[i] = menu[i].split("*"); 
 
                link = new Link(names[i][0]); 
                temp[i] = names[i][1].split("#"); 
                final_list[i] = link; 
                for (var x=0; x<temp[i].length; x++) 
                { 
                        temp2[x]  = temp[i][x].split("|"); 
                        final_list[i].url[x] = temp2[x][0]; 
                        final_list[i].title[x] = temp2[x][1]; 
                } 
        } 
give_names(); 

/**************************************************************/ 

// end jscript hiding --> 
</SCRIPT> 

</head> 
 

<BODY onLoad="createMenus()"> 
<p>What you see here are two menus used as a list of links.  When you choose a topic in the first menu, the list of links available in the second menu changes. 

<FORM NAME="myForm"> 
<INPUT TYPE="hidden" NAME="myObject" VALUE="none"> 
<SELECT NAME="main" size=1 onChange="updateMenus(this)"> 
<option>&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp 
<option> 
<option> 
</SELECT> 

Actual Links: 
<SELECT NAME="myLinks" SIZE=1 > 
<option>&nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp &nbsp 
<option> 
<option> 
</SELECT> 
<input type=button value=go onClick=window.open(document.myForm.myLinks.options[document.myForm.myLinks.selectedIndex].value)> 
</form> 
<p>If you like this script, please let me know!  You can email me, or better yet, leave a comment on the Tutorial board in my <a href="http://wwwthreads.com/mattyjay/">discussion forum...</a> 
</body> 
</html> 
<!-- Simba says Roar. -->

 
1