Menu
What is the best way to change your URL through an html select?
<select>
<option selected="selected">Change to URL X</option>
<option>Change to URL Y</option>
</select>
What Javascript should be used?
630
This is done by using onChange event of dropdown listbox. Once the user selection one option then by onChange event we run one function SelectRedirect(). The function will receive the user selected option value like this. Here we have used getElementById to get the value of the selected option.
To change the selected option in an HTML <select> element we have to change the value property on the <select> element or the selected property on the <option> element we want to get selected.
The <select> element is used to create a drop-down list. The <select> element is most often used in a form, to collect user input. The name attribute is needed to reference the form data after the form is submitted (if you omit the name attribute, no data from the drop-down list will be submitted).
<script type="text/javascript">
function navigateTo(sel, target, newWindow) {
var url = sel.options[sel.selectedIndex].value;
if (newWindow) {
window.open(url, target, '--- attributes here, see below ---');
} else {
window[target].location.href = url;
}
}
</script>
<select onchange="navigateTo(this, 'window', false);">
<option selected="selected" value="http://www.example.com/#X">Change to URL X</option>
<option value="http://www.example.com/#Y">Change to URL Y</option>
</select>
Some useful values of target might be 'window' (the current window) or 'top' (to break out of a frameset or iframe). If you want to open a new window instead, you could use navigateTo(this, 'someWindow', true);
The value of '--- attributes ---' is set using various properties as documented here for Mozilla and here for IE. For example:
'height=300,width=400,top=100,left=100,statusbar=0,toolbar=1'
If you have jQuery you could do...
javascript:
$('#select_url').change(function(evnt){ location.href = $(this).val(); });
html:
...
40
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
