隐藏与其关联的文本框字段和标签

Question

这可能是一个毫无意义的问题，但我认为这对我们中的很多人会有用。

在这种情况下，我希望能够一次性隐藏文本框及其标签，而不必单独选择这两个元素并将其隐藏起来。

<label for="a">some text:</label> 
<input type="text" class="text" id="a" /> 

因此，对于上述情况，是否可以使用简单的jQuery命令将它们隐藏在一起？

Answer 1

你能做到这一点

$('label[for=a], input#a').hide(); 

http://jsfiddle.net/jasongennaro/dYFMU/

[ ]选择attribute。在这种情况下，我们的目标是for属性等于a。

与此同时，我们使用,作出另一个选择，input与id=a。

编辑

另外，如果你需要为多个labels和inputs做到这一点，你可以把label和id在数组如下：

<label for="a">some text:</label> 
<input type="text" class="text" id="a" /> 

<br /> 

<label for="b">some text:</label> 
<input type="text" class="text" id="b" /> 

<br /> 

<label for="c">some text:</label> 
<input type="text" class="text" id="c" /> 

JS

var a = ['a','b','c']; 

for(var i=0; i<a.length; i++){ 
    $('label[for=' + a[i] + '], input#' + a[i]).hide(); 
} 

http://jsfiddle.net/jasongennaro/dYFMU/1/

Answer 2

最简单的方法可能是将它们包装在div中，然后隐藏它。

<div id="hidethis"> 
    <label for="a">some text:</label> 
    <input type="text" class="text" id="a" /> 
<div> 

$("#hidethis).hide(); 

Answer 3

找到不过你想要的输入，然后你可以找到使用

var myInputBoxID = $(some selector).attr("id"); 

然后，您可以通过下面的语法赶上引用标签的ID标签的for属性：

$("label[for=' + myInputBoxID + ']").hide(); 

你可以很好地嵌套东西，所以你不需要存储任何东西作为变量，而是运行通过你的输入框选择器的所有结果中的“for each”。但无论如何，关键是找到ID，然后使用该发现与标签标签[为= ...]

Answer 4

，如果你想重用隐藏，您可以创建类似的功能：

function hideTandem(id){ 
    $('#' + id + ', label[for=' + id + ']').hide(); 
} 

，并调用它通过提供输入的ID

hideTandem('a');