Pracuję nad projektem, w którym mam taki zestaw pól #a.

<fieldset id="a">
      <input type="checkbox" name="c1" value="v1" checked="checked" />
      <input type="checkbox" name="c2" value="v2"/>
      <input type="checkbox" name="c3" value="v3"/>
</fieldset>

To zestaw pól #a pole wyboru: jest zaznaczone to wartość dynamiczna.

Mam inny zestaw pól #b na tej samej stronie.

Chcę przydzielić/skopiować pole wyboru: jest zaznaczone wartość z zestawu pól #a do zestawu pól #b szeregowo podczas ładowania strony. [ Oba zestawy pól mają równą liczbę pól wyboru. ]

<fieldset id="b">
      <input type="checkbox" name="cc1" value="vv1"/>
      <input type="checkbox" name="cc2" value="vv2"/>
      <input type="checkbox" name="cc3" value="vv3"/>
</fieldset>

Jak mogę to osiągnąć? Dzięki.

2
MANnDAaR 22 czerwiec 2011, 16:33

3 odpowiedzi

Najlepsza odpowiedź

Możesz to zrobić za pomocą tego selektora, o którym wspomniałeś, a następnie zapętlić każdą z wartości, uzyskać ich indeks i zaktualizować kolejne pola wyboru zestawów pól zgodnie z tymi wskaźnikami.

Lubię to:

$('fieldset#a input[type="checkbox"]:checked').each(function(){   
    $('fieldset#b input[type="checkbox"]').eq($(this).index()).prop('checked',true);
});

Przykład: http://jsfiddle.net/niklasvh/hHnLu/

3
Niklas 22 czerwiec 2011, 16:53
Przed chwilą dokonałem na nim małej zmiany, użyj go zamiast tego.
 – 
Niklas
22 czerwiec 2011, 16:57
Jeśli niektóre pola wyboru zostały zaznaczone w zestawie pól #b, Twój kod nie powiedzie się. Sprawdźmy moje: jsfiddle.net/nPnMa i twoje: jsfiddle.net/NVPN6
 – 
CoolEsh
22 czerwiec 2011, 16:59
Tak, moja odpowiedź nie uwzględnia wartości w drugim zestawie pól, ponieważ nie było to częścią wymogu. Najłatwiejszym rozwiązaniem byłoby po prostu odznaczenie wszystkich pól wyboru w moim przykładzie za pomocą: $('fieldset#b input[type="checkbox"]').prop('checked',false) przed skopiowaniem, tak jak tutaj jsfiddle.net/niklasvh/NVPN6/1
 – 
Niklas
22 czerwiec 2011, 17:11

Możesz użyć czegoś takiego:

$( '#b' ).children( 'input:checkbox' ).each( function( i ) {
    var aChecked = $( '#a' ).children( 'input:checkbox' ).eq( i ).prop( 'checked' );
    if ( aChecked )
    {
        $( this ).prop( 'checked', true );
    }
    else
    {
        $( this ).removeProp( 'checked' );
    }
} );
0
CoolEsh 22 czerwiec 2011, 16:58
Właśnie zauważyłem powyżej, że kod @Niklas działa idealnie, jeśli nie obchodzi cię, które pola wyboru ZOSTAŁY zaznaczone przed wykonaniem skryptu w zestawie pól #b.
 – 
CoolEsh
22 czerwiec 2011, 17:05

Nie byłem w stanie uzyskać powyższych rzeczy, dlatego spróbowałem poniższego podejścia i zadziałało.

// lets uncheck all the checkboxes in first fieldset                                                                                             
$('#b input[type=checkbox]').removeProp('checked');                                    

  cj('#b [type=checkbox]').each(function() {
     if (cj(this).prop('checked') ) {
         // here get the index of current element 
         // then modify below code to set prop checked
         cj('#a [type=checkbox]').prop('checked',true);
     }
});

Mam nadzieję że to pomoże!!!

0
Kurund Jalmi 1 listopad 2011, 17:11