时间戳

首页 > 解决方案 > 使用 JavaScript 或 jQuery 按值获取字段集的输入

javascript - 使用 JavaScript 或 jQuery 按值获取字段集的输入

问题描述

我需要检查字段集中的特定输入，其中元素仅由不同的值定义：

      <fieldset class="collapsible">
        <legend onclick="toggleFieldset(this);">Opzioni</legend>
        <div style="">
          <table class="options">
                <td class="card-fields">
                    [...]
                    <label class="floating"><input type="checkbox" name="f_status[]" id="f_status_" value="5" />Chiuso</label>
                    <label class="floating"><input type="checkbox" name="f_status[]" id="f_status_" value="6" />Rifiutato</label>
                    [...]
      </fieldset>

我在 jQuery 中尝试了很多方法，例如：

$("#f_status_").each(function(){
   if (this.value == 2) {
      this.trigger("click");
   }
})

但没有运气。有什么帮助吗？

谢谢你。

标签： javascriptjqueryhtmlfieldset

解决方案

您不能将相同的id重复用于多个元素。这是 HTML 中的犯罪行为。改用类并使用.each()and for.trigger()工作，将其包装在里面$()：

$(function() {
  $(".f_status_").each(function() {
    if (this.value == 5) {
      $(this).trigger("click");
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label class="floating"><input type="checkbox" name="f_status[]" class="f_status_" value="5" /> Chiuso</label>
<label class="floating"><input type="checkbox" name="f_status[]" class="f_status_" value="6" /> Rifiutato</label>

$(function() {
  $(".f_status_").each(function() {
    if (this.value == 6) {
      $(this).trigger("click");
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label class="floating"><input type="checkbox" name="f_status[]" class="f_status_" value="5" /> Chiuso</label>
<label class="floating"><input type="checkbox" name="f_status[]" class="f_status_" value="6" /> Rifiutato</label>

如果您无法更改 HTML，我完全不同意，因为这是错误的 HTML，您可以执行以下操作：

$(function() {
  $('[name="f_status[]"]').each(function() {
    if (this.value == 6) {
      $(this).trigger("click");
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label class="floating"><input type="checkbox" name="f_status[]" id="f_status_" value="5" /> Chiuso</label>
<label class="floating"><input type="checkbox" name="f_status[]" id="f_status_" value="6" /> Rifiutato</label>

无论如何，我永远不会推荐这种方法。

推荐阅读