jquery - 从下拉列表中选择选项时更改所有 div 内容

Question

我想更改使用相同名称的 div 的 div 内容，代码工作正常，但它只是更改第一个 div 的内容我应该怎么做？代码如下。

<select id="select" name="cd-dropdown" class="cd-select">
<option value="-1" selected>Currency</option>
<option value="1">Dollar $</option>
<option value="2">Pound £</option>
<option value="3">Rupees </option>
<option value="4">Dirham </option>
</select>



 <script>
$(document).ready(function () {
$('.pr-price').hide();
$('#2').show();
$('#select').change(function () {
    $('.pr-price').hide();
    $('#'+$(this).val()).show();
}); });

<div id="1" class="pr-price">$100</div>
<div id="2" class="pr-price">£200</div>
<div id="3" class="pr-price">Rs300</div>
<div id="4" class="pr-price">D400</div>

Answer 1

这是因为你使用的是ID，如果你想在多个地方运行，使用Class

Working Demo

代码

$(function () {
  $('.pr-price').hide();
  $('.d2').show();

  $('#select').on("change",function () {
    $('.pr-price').hide();
    $('.d'+$(this).val()).show();
  }).val("2");
});

HTML

<div class="pr-price d1">$100</div>
<div class="pr-price d2">£200</div>
<div class="pr-price d3">Rs300</div>
<div class="pr-price d4">D400</div>