首页 > 解决方案 > 想要选择`中的第一个选项` 标记 - jQuery

问题描述

我想在<select id="Widget1727491790">ie“1”中选择第一个选项,在<select id="Widget1315144869">ie“250”中选择一个选项。我想在第<select>一个标签中选择“250”时在第二个标签中显示“1” <select>

当我这样做时,我无法将第二个的值<select>从“1”更改为“2”或“3”或任何其他值。它停留在值“1”,我无法进一步更改它。

请检查片段以更好地了解我的情况。

$(document).ready(function() {
  $('#Widget1315144869 option[value=""]').text('Select Weight');
  $('#Widget1727491790 option[value=""]').text('Select Quantity');
});

/* Quantity Auto Select - Dairy Products */
$(document).change(function() {
  var sw = $('#Widget1315144869');
  var sq = $('#Widget1727491790');
  if ($(sw).val() > '1') {
    $(sq).val('1');
  } else {
    $(sq).val('');
  }
});
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

<select class="form-control" id="Widget1315144869" name="entry.2091496022">
  <option value="">- Choose -</option>
  <option value="250">250</option>
  <option value="500">500</option>
  <option value="750">750</option>
  <option value="1000">1000</option>
</select>
<select class="form-control" id="Widget1727491790" name="entry.1395838924">
  <option value="">- Choose -</option>
  <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>

标签: jquery

解决方案


问题是您使用的是 $(document).change(function() {}),因此每当文档中发生更改时,它都会运行代码。此外,当您更改$('#Widget1727491790');;

因此,当您在一秒钟内更改某些内容时select,它将设置select1,这就是为什么感觉它永远不会改变的原因。

尝试使用:

$('#Widget1315144869').change(function() {
  var sw = $(this).val();
  var sq = $('#Widget1727491790');
  if (sw > 1) {
    $(sq).val('1');
  } else
    $(sq).val('');
});

演示

$(document).ready(function() {
  $('#Widget1315144869 option[value=""]').text('Select Weight');
  $('#Widget1727491790 option[value=""]').text('Select Quantity');
});

/* Quantity Auto Select - Dairy Products */
$('#Widget1315144869').change(function() {
  var sw = $(this).val();
  var sq = $('#Widget1727491790');
  if (sw > 1) {
    $(sq).val('1');
  } else
    $(sq).val('');
});
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

<select class="form-control" id="Widget1315144869" name="entry.2091496022">
  <option value="">- Choose -</option>
  <option value="250">250</option>
  <option value="500">500</option>
  <option value="750">750</option>
  <option value="1000">1000</option>
</select>
<select class="form-control" id="Widget1727491790" name="entry.1395838924">
  <option value="">- Choose -</option>
  <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>


推荐阅读