Question

我试图显示一个选择框，如果选择的值与先前选择的值相同。上一个选择框带有多个选择选项。当我选择2个或更多选项时，隐藏试图显示选择框的内容。
这是我的HTML和JS代码。

$('.show1').on('change', function() {
  var optionSelected1 = $("option:selected", this);
  var valueSelected1 = this.value;
  if (valueSelected1 == "කාර්") {
    $("#text_area1").show();
  } else {
    $("#text_area1").hide();
  }
});

$('#text_area1').ready(function() {
  $("#text_area1").hide();
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="tab">
  <div class="form-group row">
    <label for="colFormLabelSm" class="col-sm-12 col-form-label col-form-label-sm mb-md-3">ඔබගේ කල්පවත්නා භාණ්ඩ හිමිකම සඳහන් කරන්න</label>
    <div class="col-sm-12">
      <select class="form-control col-sm-12 js-example-basic-multiple show1" name="media[]" multiple="multiple">
        <option value="ෆි්‍රජ්">ෆි්‍රජ්</option>
        <option value="කාර්">කාර්</option>
        <option value="රූපවාහිනී">රූපවාහිනී</option>
        <option value="රෙදි සෝදන යන්ත්‍ර">රෙදි සෝදන යන්ත්‍ර</option>
        <option value="Cable TV">Cable TV</option>
        <option value="මෝටර් සයිකල්">මෝටර් සයිකල්</option>
        <option value="ලැප්ටොප්">ලැප්ටොප්</option>
        <option value="Gas cooker">Gas cooker</option>
        <option value="Micro Wave">Micro Wave</option>
      </select>
    </div>
  </div>
  <div id="text_area1" class="form-group row">
    <label class="col-sm-12 col-form-label col-form-label-sm mb-md-3">ඔබගේ කරයේ වටිනාකම</label>
    <div class="col-sm-12">
      <select id="show1" class="form-control col-sm-12" name="media">
        <option value="මිලියන  3 ට අඩු">මිලියන 3 ට අඩු</option>
        <option value="මිලියන 3 ජ් 10 අතර">මිලියන 3 ජ් 10 අතර</option>
        <option value="මිලියන 10 ට වැඩි">මිලියන 10 ට වැඩි</option>
      </select>
    </div>
  </div>
</div>

Answer 1

将选定的选项转换为数组类型，然后使用Array.prototype.some()检查是否已选择该值：

$(".show1").on("change", function() {
    const isSelected = Array.from($(this).find("option:selected")).some(
        e => e.value === "කාර්"
    );

    isSelected ? $("#text_area1").show() : $("#text_area1").hide();
});

当我在JavaScript中使用多个选定的选项时，如何使用.show（）

1 个答案: