Tengo un conmutador de conmutación múltiple que proviene del código PHP/Mysql, quiero mostrar el div en ese conmutador que actualmente está activado .
Además, quiero mostrar/ocultar div cuando ese interruptor de encendido/apagado
Mi código Php:
<li> <?php echo $_ship_method_value['shipping_title'];?> <label class="switch"> <!-- Toggled Case --> <input type="checkbox" id="toggd" name="toggle" value="<? echo $_ship_method_value['shipping_id']; ?>" class='cmn-toggle cmn-toggle-round' data-switchery <? if(array_key_exists("shipping_available",$_ship_method_value)) echo 'checked'; ?> /> <span class="slider round hide-off"></span> </li> <div class="show-hide"> <p>Want to show this div ;-)</p> </div>Mi código jQuery
$('input[name=toggle]').change(function(){ var mode = $(this).prop('checked'); if(mode == true){ $(".show-hide").show(); }else{ $(".show-hide").hide(); } });'pero este código solo funciona al hacer clic en alternar para el evento de alternar único.
Por favor, ayúdame a encontrar la solución. ¡Gracias!
$('.toggle_check_box').change(function(){ var mode = $(this).prop('checked'); if(mode == true){ $(".show-hide").show(); }else{ $(".show-hide").hide(); } });puede aplicar la clase para su casilla de verificación y usarla así ... Esto alternará div en todos los botones de cambio
$('body').on('change', 'input[name=toggle]', function() { var mode = $(this).prop('checked'); if (mode == true) { $(".show-hide").show(); } else { $(".show-hide").hide(); } });** Actualizar **
Si div se encuentra junto a li, entonces el siguiente código funcionará para usted.
$('body').on('change', 'input[name=toggle]', function() { var mode = $(this).prop('checked'); if (mode == true) { $(this).closest("li").next(".show-hide").show(); } else { $(this).closest("li").next(".show-hide").hide(); } });