Cześć chłopaki,

Próbuję zmienić w tle i kolor wszystkich moich pola wyboru w formie z jQuery. Nie mogę tego załatwić.

Tak wygląda mój kod teraz:
Część HTML:

<form action="" method="">
    <div id="child1">
        <input type="checkbox" class="select-all-checkboxes" name="select-all-checkboxes" />
    </div>
    <div id="child2">
        <input type="checkbox" name="checkboxs[]" />
        <input type="checkbox" name="checkboxs[]" />
        <input type="checkbox" name="checkboxs[]" />
        <input type="checkbox" name="checkboxs[]" />
    </div>
</form>

Część jQuery

$('form input.select-all-checkboxes:checkbox').live('click', function()
{
    if($(this).attr('checked') == true)
    {
        $(this).parent('form').children('input:checkbox').css({
            background: 'rgba(0, 255, 0, 0.5)',
            border: '1px solid green'
        });   
    }
    else
    {
        $(this).parent('form').children('input:checkbox').css({
            background: 'none',
            border: '1px solid transparent'
        });   
    }
});

To, co powinno to zrobić, gdy klikniesz pole wyboru za pomocą klasy wyboru klasy ", a następnie wszystkie pola wyboru w formularzu należy sprawdzić i uzyskać inną granicę i tło.

Po prostu nie mam do pracy. Mam nadzieję, że mogą mi pomóc.

Z góry dziękuję,
znak

0
DijkeMark 2 grudzień 2011, 23:46

3 odpowiedzi

Najlepsza odpowiedź

Twój selektor jest nie tak. Musisz użyć parents i find. Mimo to zasada stylu wydaje się mieć wpływ na pola wyboru w Chrome

$(this).parents('form').find('input:checkbox')
2
Joseph Marikle 2 grudzień 2011, 19:56

HTML:

<form action="" method="">
<div id="child1">
    <input type="checkbox" class="select-all-checkboxes" name="select-all-checkboxes" />
</div>
<div id="child2">
    <input type="checkbox" class= 'child_box' name="checkboxs[]" />
    <input type="checkbox" class= 'child_box' name="checkboxs[]" />
    <input type="checkbox" class= 'child_box' name="checkboxs[]" />
    <input type="checkbox" class= 'child_box' name="checkboxs[]" />
</div>
</form>

CSS:

 .greenbox{outline:#00ff00 solid 2px;}

JQuery:

$(function(){
  $('.select-all-checkboxes').click(function(){
    $(this).parent().parent().find('.child_box').attr('checked', this.checked);
    if (this.checked == true){
      $(this).parent().parent().find('.child_box').addClass('greenbox');   
    }else{
      $(this).parent().parent().find('.child_box').removeClass('greenbox');  
    }
  });
});
1
Jason Aller 23 październik 2016, 19:22

Próbowałeś:

$ ('. Wybierz-wszystkie-pola wyboru'). Kliknij (Funkcja () {

?

0
Steve 2 grudzień 2011, 19:50