javascript - 使用jquery，css单击选择选项时如何显示图像

Question

如何在我们选择下面的选项时显示图像。

示例:-

<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>

如果我们在 div 上选择 paypal，id="payment" 将显示 paypal 标志，如果是 bank 将显示银行标志。

可以用jquery做吗？让我知道。

Answer 1

假设:您的银行 Logo 名为 bank.gif。

编辑:添加代码以检查空白值。

$('select[name=payment]').change(function() {

  var val = $(this).val();

  $('div#payment img')
    .attr('src', val + '.gif')
    .css('display', val.length ? 'block' : 'none');
});