I have the following HTML code:
<select name="forma"> <option value="Home">Home</option> <option value="Contact">Contact</option> <option value="Sitemap">Sitemap</option> </select>
How can I make Home, Contact and Sitemap values as links? I used the following code and as I expected it didn’t work:
<select name="forma"> <option value="Home"><a href="home.php">Home</a></option> <option value="Contact"><a href="contact.php">Contact</a></option> <option value="Sitemap"><a href="sitemap.php">Sitemap</a></option> </select>
<select name="forma" onchange="location = this.value;"> <option value="Home.php">Home</option> <option value="Contact.php">Contact</option> <option value="Sitemap.php">Sitemap</option> </select>
UPDATE (Nov 2015): In this day and age if you want to have a drop menu there are plenty of arguably better ways to implement one. This answer is a direct answer to a direct question, but I don’t advocate this method for public facing web sites.
UPDATE (May 2020): Someone asked in the comments why I wouldn’t advocate this solution. I guess it’s a question of semantics. I’d rather my users navigate using
<a> and kept
<select> for making form selections because HTML elements have semantic meeting and they have a purpose,
anchors take you places,
<select> are for picking things from lists.
<select> you have used for navigation? It is saying “please pick a page name” and not a lot else, certainly nothing about navigating. The easy response to this is
well i know that my users will be using IE or whatever so shrug but this kinda misses the point of semantic importance.
Whereas a funky drop-down UI element made of suitable layout elements (and some js) containing some regular anchors still retains it intent even if the layout element is lost, “these are a bunch of links, select one and we will navigate there”.
Here is an article on the misuse and abuse of