PHP动态创建与JQuery复选框.toggle（）

Question

我已经动态地创建了PHP中的复选框数组的窗体，但我不想提交按钮出现，除非至少有一个复选框被选中。在互联网上搜索大多数希望提交按钮仅在检查复选框后才出现的用户只有一个“我同意”复选框。它是阻止我的脚本工作的动态创建吗？

PHP↴

// Dynamically create checkboxes from database 
function print_checkbox($db){ 
    $i = 0; 
    foreach($db->query('SELECT * FROM hue_flag') as $row) { 
     if ($i == 0 || $i == 3 || $i== 6 || $i == 9){ 
      echo '<br><br>'; 
     } 
     $i++; 
     echo '<span class="'.$row['1'].'"><label for="'.$row['1'].'">'.ucfirst($row['1']).'</label><input type="checkbox" name="hue[]" id="hue" value="'.$row['0'].'"></span> '; 
    } 
} 

jQuery↴

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $('#hue[]').click(function(){ 
     $('#input_gown').toggle(); 
    }); 
}); 
</script> 

PHP函数call↴

<?php print_checkbox($conn_normas_boudoir);?> 

诚然，我什么都不知道的jQuery或JavaScript和我仍然在学习PHP。所以，如果有更好的方法来实现这一点，让我知道。

Answer 1

你给你所有的复选框相同的ID。这是不允许的; ID必须是唯一的。

一个简单的解决这两个问题是分配的所有复选框共同类型：

echo '<span class="'.$row['1'].'"><label for="'.$row['1'].'">'.ucfirst($row['1']).'</label><input type="checkbox" name="hue[]" class="hue" value="'.$row['0'].'"></span> '; 

然后在jQuery的选择类：

$('.hue').change(function(){ 
    $('#input_gown').toggle(); 
}); 

但这种情况可能会出现意想不到的结果;如果检查两个复选框会怎么样？ #input_gown元素将再次打开和关闭。也许你只是想，如果至少一个复选框被选中它显示：

$('.hue').change(function(){ 
    var val = false; 
    $('.hue').each(function() { 
     val = val || $(this).is(':checked'); // any checked box will change val to true 
    }); 
    $('#input_gown').toggle(val); // true=show, false=hide 
}); 

http://jsfiddle.net/mblase75/AyY3Z/

Answer 2

您的jQuery选择器正在寻找编号为hue[]的元素。但是你的元素只有hue。

更改此：↴

$(document).ready(function(){ 
    $('#hue[]').click(function(){ 
     $('#input_gown').toggle(); 
    }); 
}); 

这个（ID应该真的永远是独一无二的，而方括号需要进行转义与选择的发动机工作），（a demo））：↴

$(document).ready(function(){ 
    $('input[name=hue\\[\\]]').click(function(){ 
     $('#input_gown').toggle(); 
    }); 
});