How to make a drop down menu.

.:.wolvie.:. 0 Tallied Votes 341 Views Share

This snippet tells easily how to make a drop down menu! Easy as pie and quick too!

Ok, to start off... get your website ready that you 
want to put the drop down menu on.
 Then format it as you want it. 
Left, right, center... 
(left is <div align= left> YOUR CODES AND SUCH HERE</div> 
 center is <center> YOU CODES AND SUCH HERE</center> 
  right is the same as left but change left to right.)
Then type in this 
code but change the things around.
 for example...
<form name="gotolocation1" method="POST" ACTION=URI>
<select name="serchengines"> 
<option value="www.google.com">Google</option>
<option value="www.yahoo.com">Yahoo</option>
<option value="www.dogpile.com">Dogpile</option>
</select>
<input type="button" onClick="location =
document.gotolocation1.lissamenu1.options
[document.gotolocation1.lissamenu1.selectedIndex].value;"
value="Go">
</form>
 There's just one example, easy to change around. This one goes to google, yahoo, and dogpile.com . 
Well have fun with them!

Dani AI

Generated

A quick clarification and corrected approach that addresses the common problems raised in this thread (broken name references, missing URL scheme, and usability):

The snippet from uses an HTML <select> to pick a destination. Two frequent causes of “It won't execute the URL” (as reported) are: 1) JavaScript referencing the wrong form/select name, and 2) option values like www.google.com lacking the protocol so the browser treats them as relative paths. The example below fixes those and adds a simple, accessible pattern with a separate Go button.

<form id="goto">
  <label for="site">Go to:</label>
  <select id="site">
    <option value="">-- choose --</option>
    <option value="https://www.google.com">Google</option>
    <option value="https://www.yahoo.com">Yahoo</option>
    <option value="https://www.dogpile.com">Dogpile</option>
  </select>
  <button type="button" id="go">Go</button>
</form>

<script>
document.getElementById('go').addEventListener('click', function () {
  var url = document.getElementById('site').value;
  if (url) window.location.href = url;
});
</script>

A shorter alternative uses onchange on the <select> to jump immediately (note accessibility trade-offs):

<select onchange="if(this.value) window.location.href=this.value;">
  <option value="">Select a site</option>
  <option value="https://example.com">Example</option>
  <option value="/local/page.html">Local page</option>
</select>

Practical notes: always include https:// for external URLs (or use absolute/relative paths for same-site links); use type="button" to avoid accidental form submissions; prefer an explicit Go button for keyboard and screen-reader users; and for true navigation dropdowns use semantic <nav> + <ul> with CSS/ARIA and keyboard handling rather than a <select>. This also answers ’s confusion and expands on and ’s points about how option text vs. value work and how to change entries.

Blade10878 0 Junior Poster in Training

i dont get it

mmiikkee12 1 Posting Whiz in Training

It makes a drop-down menu. The things in the <option> tags get added to the menu as options.

bajatmerc 0 Newbie Poster

explaining failure lol


Next time instead of saying "...change the things around." you should explain how to change it. People who are coming to read this explanation like myself can copy the code and see that it works. Knowing what was done or how to replicate it in a useful way is another matter though.

jangirke 0 Newbie Poster

It won't execute the URL

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.