Селектор jQuery для метки флажка

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

Если у меня есть флажок с меткой, описывающей его, как я могу выбрать ярлык с помощью jQuery? Было бы проще дать тегу метки ID и выбрать, используя $(#labelId)?

Ответ 2

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

Это должно позволить вам выбирать метки для всех полей в цикле. Все, что вам нужно, это ваши метки должны сказать for='FIELD', где FIELD - это идентификатор поля, для которого эта метка определена.

Ответ 3

Это должно сделать это:

$("label[for=comedyclubs]")

Если у вас нет буквенно-цифровых символов в вашем идентификаторе, вы должны окружить значение attr кавычками:

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

Ответ 4

Другим решением может быть:

$("#comedyclubs").next()

Ответ 5

Спасибо Kip, для тех, кто может стремиться к тому же, используя $(this) во время итерации или связывания внутри функции:

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

Я искал какое-то время во время работы над этим проектом, но не смог найти хороший пример, поэтому я надеюсь, что это поможет другим, кто может решить эту проблему.

В приведенном выше примере моя цель состояла в том, чтобы скрыть радиовходы и наметить метки, чтобы обеспечить пользовательский интерфейс slicker (изменение ориентации блок-схемы).

Вы можете посмотреть пример здесь

Если вам нравится пример, вот 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 {}