Java-Scripts.net

Dropdown Selection Message

Interactive product details. Allow users to select an option from a list and instantly see related information without reloading the page.

Details will appear here.

Copy the Script

<script>
function updateInfo(select) {
    var msg = "";
    var val = select.value;
    
    if (val == "1") msg = "Price: $10/mo - Good for starters.";
    else if (val == "2") msg = "Price: $50/mo - Best for growing teams.";
    else if (val == "3") msg = "Price: Contact Us - Full support.";
    
    document.getElementById("message").innerHTML = msg;
}
</script>

<select onchange="updateInfo(this)">
    <option value="1">Basic</option>
    <option value="2">Pro</option>
    <option value="3">Enterprise</option>
</select>

<div id="message"></div>

Frequently Asked Questions

You can store the data in the `value` attribute of the option, or use a JavaScript object/array to map keys (IDs) to longer text descriptions.

Yes. The logic is the same: retrieve the ID from the dropdown, find the corresponding image path, and update an `` src attribute.

Since the content is hidden or injected via JavaScript, search engines might not index the hidden descriptions as primary content. It's best for UI interactivity, not core content.