jQuery选择器的复选框的标签

212

<input type="checkbox" name="filter" id="comedyclubs"/> 
<label for="comedyclubs">Comedy Clubs</label>

如果我有一个复选框与描述它的标签，我怎样才能使用jQuery选择标签？给标签标签一个ID并使用$(#labelId)选择该标签会更容易吗？jQuery选择器的复选框的标签

来源

2009-07-27 Darwyn

386

这应该工作：

$("label[for='comedyclubs']")

参见：Selectors/attributeEquals - jQuery JavaScript Library

来源

2009-07-27 04:23:26 Kip

对于WebKit浏览器（Safari /铬），你可以做`$（ '＃comedyclubs'）[0] .labels`访问指定`＃comedyclubs`的所有标签。 – Matt 2012-08-09 02:17:08

使用.text（）将对象转换为字符串： alert（$（“label [for ='comedyclubs']”）。text（））; – Loren 2012-12-12 18:56:35

只需使用$（“label [for ='comedyclubs']”）即可获得价值，但会使标签变为空白。所以，使用$（“label [for ='comedyclubs']”）。text（） – shahil 2014-01-12 08:47:33

这应做到：

$("label[for=comedyclubs]")

如果有非字母数字字符您的帐号，那么你必须围绕ATTR报价值：

$("label[for='comedy-clubs']")

来源

2009-07-27 04:23:51

奇怪的是，当这个答案被提交的时间和领先的答案一样时，声誉如何。 :) – sscirrus 2013-04-19 05:56:39

另一种解决办法是：

$("#comedyclubs").next()

来源

2011-02-02 10:23:57 Briganti

$("label[for='"+$(this).attr("id")+"']");

这应该允许您在一个循环中的所有字段选择标签为好。所有你需要确保的是你的标签应该说for='FIELD'其中FIELD是这个标签被定义的字段的id。

来源

2012-08-03 07:08:34

感谢硖，对于那些谁可能会寻找到实现使用$相同（本），而迭代或函数内的关联：

$("label[for="+$(this).attr("id")+"]").addClass("orienSel");

我看了一会儿，而工作的这个项目，但不能找到一个很好的例子，所以我希望这可以帮助其他可能希望解决相同问题的人。

在上面的示例中，我的目标是隐藏无线电输入并设置标签样式以提供更加流畅的用户体验（更改流程图的方向）。

您可以see an example here

如果你喜欢的例子，这里是CSS：

.orientation {  position: absolute; top: -9999px; left: -9999px;} 
    .orienlabel{background:#1a97d4 url('http://www.ifreight.solutions/process.html/images/icons/flowChart.png') no-repeat 2px 5px; background-size: 40px auto;color:#fff; width:50px;height:50px;display:inline-block; border-radius:50%;color:transparent;cursor:pointer;} 
    .orR{ background-position: 9px -57px;} 
    .orT{ background-position: 2px -120px;} 
    .orB{ background-position: 6px -177px;} 

    .orienSel {background-color:#323232;}

和JavaScript相关的部分：

function changeHandler() { 
    $(".orienSel").removeClass("orienSel"); 
    if(this.checked) { 
     $("label[for="+$(this).attr("id")+"]").addClass("orienSel"); 
    } 
};

的备用根原问题，考虑到标签跟随输入，你可以去一个纯CSS的解决方案，并避免使用JavaScript ...

input[type=checkbox]:checked+label {}

来源

2017-03-05 09:50:24

jQuery选择器的复选框的标签

回答

相关问题