Jquery选择器，用于在一个元素之后的表单中所有带有class的元素

Jquery selector for all elements with class in a form that are after one element

本文关键字：元素 之后 表单 class 一个 用于 选择器 Jquery      更新时间：2023-09-26

我需要找到'el'之后的形式中类别为'complexList'的所有元素。

var el = $(this);
var els = $('#' + obj.tableId + '_editorForm').find('.complexList');
el.nextAll('.complexList') //dont work

谢谢

如果nextAll不起作用，则意味着存在不同层次的嵌套元素。但是你仍然可以这样做，用index和slice。

els = els.slice(els.index(el) + 1);

index，当如上调用时，在匹配集合中查找给定元素的索引;slice返回集合中元素的子集。因此，我们要求从el之后的元素开始的子集。

的例子:

var obj = {
  tableId: "foo"
};
$(document.body).on("click", ".complexList", function() {
  var el = $(this);
  var els = $('#' + obj.tableId + '_editorForm').find('.complexList');
  els.css("color", ""); // clear previous
  els = els.slice(els.index(el) + 1);
  els.css("color", "blue");
});
All of the text fields below are `.complexList` fields. Click any of them to turn all `.complexList` elements <em>after</em> it blue.
<form id="foo_editorForm">
  <label>
    Field 1:
    <input type="text" class="complexList" value="field1">
  </label>
  <label>
    Field 2:
    <input type="text" class="complexList" value="field2">
  </label>
  <label>
    Field 3:
    <input type="text" class="complexList" value="field3">
  </label>
  <label>
    Field 4:
    <input type="text" class="complexList" value="field4">
  </label>
  <label>
    Field 5:
    <input type="text" class="complexList" value="field4">
  </label>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

相关文章：