Welcome to WebmasterWorld Guest from 54.163.35.238

Forum Moderators: open

Message Too Old, No Replies

JavaScript SelectBox

Basic HTML select box created in External JS file

     

wfernley

2:46 pm on Jan 5, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hey everyone,

I need to create a basic HTML select box that will contain all my products. This select box will then be displayed on all my pages and allow visitors to quickly select a product in the select box and it will then forward them to the correct page.

Considering I have thousands of products, I was hoping to make this select box in an external JS file so search engines don't have to read through all the code.

Is it possible to call in an external JS file that creates this select box? This will mean it only takes up one line of code on the page and a search engine doesn't have to read through all the select box' code.

Thanks in advance for your help!

Wes

Birdman

3:35 pm on Jan 5, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hello,

This should do what you need. It simply uses the innerHTML object and dynamically writes the <option>s into the <select>:

The External JS:

window.onload = loadProducts;

function loadProducts() {
mySelect = document.getElementById('myProducts');
mySelect.innerHTML = '<option value="http://google.com">Google</option>';
mySelect.innerHTML += '<option value="http://yahoo.com">Yahoo!</option>';
}

Head of HTML Page:

<script type="text/javascript" src="path/to/js.js"></script>

Body of HTML Page:

<select id="myProducts" onchange="window.location.href=this.value"></select>

 

Featured Threads

Hot Threads This Week

Hot Threads This Month