Selecting Image to Display in Form

[Total: 0    Average: 0/5]

The select list enables the user to choose which image to display.

Head Code:

<script>
function showimage(_form)
{
  var _obj=document.getElementById("pic");
  var _file=_form.sel1.options[_form.sel1.selectedIndex].value;
  _form.test.value=_file;
  _obj.src=_file;
}
</script> 

Body Code:

<form>
<select name=sel1 onchange="showimage(this.form)">
<option value="http://www.js-examples.com/data/pic1.gif">Image 1</option>
<option value="http://www.js-examples.com/data/pic2.gif">Image 2</option>
<option value="http://www.js-examples.com/data/pic3.gif">Image 3</option>
<option value="http://www.js-examples.com/data/pic4.gif">Image 4</option>
</select>

<hr>
<input type=text name=test value="">
</form>
<img id='pic' src='http://www.js-examples.com/data/pic1.gif' name='pictures'>

Times Viewed: 4

Leave a Reply

Your email address will not be published. Required fields are marked *