Как скрыть текстовые поля, если флажки не отмечены - JQuery

Question

Я пытаюсь использовать jQuery для просмотра формы и для каждого из флажков «если отмечено», а затем отображает div, содержащий текстовое поле.

Каждый ДИВ для CheckBox ид «checkbiox_foo» это идентификатор «» checkbox_foo_reasons

я полный нуб в JQuery, так что я получил это далеко, но я не могу выбрать DIV, чтобы скрыть или показать его.

$(document).ready(function() { 
$('#storySelection input').each(function(){ 
    if($(this).is(':checked')){ 
    alert($('#'+this.id+'_reasons')); 

    } 
}); 
}); 

любая помощь с благодарностью получена.

Cheers,

Пол

Answer 1

Не видя ваш HTML, я не могу знать наверняка, но вы можете что-то вроде этого:

$(function() { 
    $('#storySelection input').click(function() { 
    var $this = $(this); 
    if ($this.is(':checked')) { 
     $this.next('div').show(); 
    } else { 
     $this.next('div').hide(); 
    } 
    }) 
}); 

Answer 2

Вы можете сделать это с помощью .change() и .toggle(), например:

$(function() { 
$('#storySelection input').change(function() { 
    $('#'+this.id+'_reasons').toggle(this.checked); 
}); 
})