Question

我试图通过使用jQuery更改下拉值来更改label的值，但它不起作用。请帮我解决这个问题。

<select id="myselect">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>
<br/>
<label id="label"></label>
<br/>

$("label").val("150.000.000");
$(("#myselect").val()).on('change', function() {
    if ($("#myselect").val() == '1') {
        $("#label").val("150.000.000");
    } else  {
        $("#label").val("350.000.000");
    }
});

Answer 1

附加到change事件的选择器不正确，您需要将元素的id作为字符串提供，而不是元素本身的值。此外，label元素没有使用text()更改它们所需的值，您可以在this处理程序中使用change来引用{{ 1}}元素。试试这个：

select

$("label").text("150.000.000");
$("#myselect").on('change', function() {
  if ($(this).val() == '1') {
    $("#label").text("150.000.000");
  } else {
    $("#label").text("350.000.000");
  }
});

您甚至可以将JS代码缩短为：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="myselect">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>

<br/>
<label id="label"></label>
<br/>

Answer 2

您可以将所有值保存在数组中，并可以使用值来计算要选择的值的索引。

以下代码段描述了相同的内容：

＆＃13;

var data = ["150.000.000", "350.000.000", "550.000.000", "750.000.000"];

$("#myselect").on("change", function() {
  var selectedVal = $("option:selected",this).val();
  var newValue = data[parseInt(selectedVal)-1];
  $("#label").text(newValue);
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<select id="myselect">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>

<br/>
<label id="label"></label>
<br/>

＆＃13;

Answer 3

试试这段代码：

  $(document).ready(function() {
  $("label").text("150.000.000");
  $("#myselect").on('change', function() {
    if ($("#myselect").text() == '1') {

      $("#label").text("150.000.000");

    } else {

      $("#label").text("350.000.000");
    }
  });
});

使用JQuery更改下拉值中更改label的值

3 个答案: