Pascal Boschma Pascal Boschma - 2 years ago 159
PHP Question

jQuery change image when SELECT changes

Hello Stackers,

I'm having a question about jQuery. I have the following code, and I want that if I select one of the options, that the Image SRC changes to that path. (Direct, without any other clicks). Is this possible? (It's a kind of Live Preview of the selected image) I Tried, but it doesn't seem to be working.

The Form and Image Display

<b>Afbeelding</b><br><select name="choose" id="choose">
if ($handle = opendir('C:/inetpub/wwwroot/magieweb/images/news'))
while (false !== ($file = readdir($handle)))
if ($file == '.' || $file == '..')

echo '<option value="' . $file . '"';

if (isset($_POST['topstory']) && $_POST['topstory'] == $file)
echo ' selected';

echo '>' . $file . '</option>';

<ul style="border: 1px solid #2087A1; list-style-type: none; margin-right:40px; min-height:30px;">
<li><strong style="color:#2087A1; margin-top:3px; margin-bottom:3px;">Nieuwsafbeelding Preview</strong></li>
<li><img id="blah" src=""></li>


My jQuery

$('#blah').attr('src', this.value);

Thanks in Advance

Answer Source

Updated: retrieves selected option value from select box on change.

	$('#my_changing_image').attr('src', $('#my_select_box').val());
<script src=""></script>
<select id="my_select_box">
<option value="">something</option>
<option value="">something else</option>

<img id="my_changing_image" src="" />

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download