JQuery 选择除隐藏之外的输入字段答案

【问题标题】：JQuery Select Input Fields Except HiddenJQuery 选择除隐藏之外的输入字段
【发布时间】：2010-03-07 15:52:31
【问题描述】：

我在表格中有一行，其中包含一个复选框和一些其他表单字段（文本框、隐藏字段、选择列表）。选中该复选框后，我想禁用该行中的所有表单字段，隐藏字段除外。我大部分时间都在工作，但我似乎无法忽略隐藏字段。

选择表格行中的所有表单字段但忽略选择中的隐藏字段的最佳方法是什么？

【问题讨论】：

标签： jquery

【解决方案1】：

$(":input:not([type=hidden])")

":input" 是一个 jQuery 伪选择器..."选择所有输入、文本区域、选择和按钮元素。" http://api.jquery.com/input-selector/

【讨论】：

【解决方案2】：

假设“隐藏”是指type="hidden" 即：

<input type="hidden" name="foo" value="bar">

那么您可以使用attribute not equals selector 来执行此操作：

$("tr input:checkbox").click(function() {
  var cb = $(this);
  var tr = $(this).closest("tr");
  if (cb.val()) {
    tr.find("input[type!='hidden']").attr("disabled", true);
  } else {
    tr.find("input[type!='hidden']").removeAttr("disabled");
  }
});

我的一般建议是避免使用属性选择器。他们很慢。给相关的输入（隐藏的或非隐藏的）一个类，然后在选择器中使用它。

如果您的意思是“隐藏”如“不可见”，则使用 :visible 选择器：

$("tr input:checkbox").click(function() {
  var cb = $(this);
  var tr = $(this).closest("tr");
  if (cb.val()) {
    tr.find("input:visible").attr("disabled", true);
  } else {
    tr.find("input:visible").removeAttr("disabled");
  }
});

【讨论】：

@Cletus 你认为带有检查“this.type”是否“隐藏”的函数的 filter() 调用会比选择器内属性测试更快吗？
啊，从来没想过用类来标记它们。不错！
@cletus - 使用类的优秀技巧。只是让我的生活变得有价值。

【解决方案3】：

你也可以使用隐藏选择器解决这个问题

$("input:not(:hidden)")

另请参阅：jQuery hidden selector

【讨论】：

【解决方案4】：

我在 jquery 中找到了一种简单的方法。

$("tr input").not("input[type='hidden']")

在下面的代码 sn-p 中，有一个 id 为 tabsDiv 的 div 包含多个 html 元素，此代码获取此 div 内的所有输入元素，除了类型为 hidden 的元素。

$("#tabsDiv").find("input").not("input[type='hidden']")

【讨论】：

【解决方案5】：

…………

$('tr input').attr('disabled', true)
$('tr input[type="hidden"]').removeAttr('disabled')

【讨论】：

【解决方案6】：

首先，您需要标记您的“选择器”复选框（例如，使用类属性“选择器”），以便清楚它用于检查而不是常规表单元素。然后您使用这个：

$('table :checkbox.selector').click(function(ev) {
    $(ev.currentTarget)
            .parents('td').siblings('td')
            .find(':input:not([type=hidden])')
            .attr('disabled', ev.currentTarget.checked);
});

此解决方案适用于所有输入（例如选择列表、文本区域），并且不会禁用选择器复选框本身。

我假设你使用最新的 jQuery。

【讨论】：

【解决方案7】：

只需添加一个可见的过滤器，这意味着它只需要用户可见的输入元素。
这对我有用，我正在添加 30 个字符的描述。

$("输入：可见")

【讨论】：

【解决方案8】：

你可以使用它，它对我来说很好用：

var $inputs = $('#formArticle :input:not(:hidden)');

formArticle 是我的表单名称。

【讨论】：