Question

How to show an image while we select the option below.

Example : –

<select name="payment">
<option value="">Please Select</option>
<option value="Paypal">Paypal</option>
<option value="Bank">Bank</option>
</select>

<div id="payment"><img src="paypal.gif" alt="paypal" /></div>

If we select paypal on div id="payment" will show the logo paypal and if bank will show bank logo.

Can be done with jquery? let me know.

Answer 1

Doh, misread the question, updated:
You can do this with just a small event handler, like this:

$(function() {
  $("select[name=payment]").bind("change", function() {
    $("#payment img").attr('src', $(this).val().toLowerCase() + ".gif");
  }).change();
});

This approach adjusts the src of the image based on the current selected value. Also, we’re triggering the event one time on document.ready to make the initial hide/show state match the dropdown.