javascript - 缓存事件变量而不将其设为全局变量

Question

您可以说这适用于大多数事件，但在我的例子中，适用于选择框的 change 事件。我有两个选择框。我想根据选择框中的选项插入/重新插入，具体取决于第一个选择框中选择的选项。我已经设法做到了这一点，但需要注意的是，为我想要操作的选项创建一个全局变量。有没有办法在事件中执行此操作，或者在变量不是全局的情况下采取某种解决方法？

HTML

<select id="vehicles">
  <option value="motorcycle">Motorcycle</option>
  <option value="bicycle">Bicycle</option>
  <option value="unicycle">Unicycle</option>
</select>
<select id="speeds">
  <option class="remove" value="four">Four Speed</option>
  <option class="remove" value="three">Three Speed</option>
  <option class="remove" value="two">Two Speed</option>
  <option value="one">One Speed</option>
</select>

JS

$(function() {
  var options =  $(".remove");

  $("#vehicles").on("change", function() {
    if ($("option:selected").attr("value") == "unicycle") {
      options.detach();
    } else {
      $("#speeds").append(options)
    }
  });
});

<强> JSFiddle

Answer 1

你为什么不尝试这样的事情:

$(function() {
    $("#vehicles").on("change", function() {
        if ($("option:selected").attr("value") == "unicycle") {
            $("#speeds option.remove").hide();
        } else {
            $("#speeds option").show();
        }
    });
});

我不确定这是否是您想要的。