Change Page Based On Drop Down Menu

March 22, 2014 by Uncategorized No Comments

Hi All,

following is the jquery code needed to change a html pages content based on a drop down box selection,

<script src=””>

$(function() {
$(‘select’).change(function() {
var val = $(this).val();
if (val) {
$(‘div:not(#div’ + val + ‘)’).slideUp();
$(‘#div’ + val).slideDown();
} else {


<select id=”selectme”>
<option value=”1″>Volvo</option>
<option value=”2″>Saab</option>
<option value=”3″>Opel</option>
<option value=”4″>Audi</option>

<div id=”div1″ class=”group”>
<p>Div 1</p>

<div id=”div2″ class=”group”>
<p>Div 2</p>

<div id=”div3″ class=”group”>
<p>Div 3</p>

<div id=”div4″ class=”group”>
<p>Div 4</p>


This will allow you to change your pages content depending on the dropdown option selected.