Question

我有记录集中的记录列表：

 <?php while($row = mysqli_fetch_array($result_imprint))  
{ ?> 
    <tr><td><input type="checkbox" id="location_<?php echo $row['location_id']; ?>" name="location_[<?php echo $row['location_id']; ?>]" value="location_<?php echo $row['imprint_location']; ?>"/> </td>
    <td><?php echo $row['imprint_location']; ?></td>
    <td><?php echo $row['max_size']; ?></td>
    <td><?php echo $row['imprint_type']; ?> </td>
    <td> <?php echo $row['max_colours']; ?></td>
    <td><?php echo $row['setup_fee']; ?></td></tr>
<?php } ?>

如果有人从其中一条记录中检查了一个方框，我无法弄清楚如何显示div。最多有六条记录，我已经完成了div：

    <div class="location_1" id="location_1" style="display: none;">
<br /><hr class="style-seven">
Content Here
</div>

这是我使用的代码，但它似乎不起作用：

$(document).ready(function(){
$('#location').change(function(){
        if(this.checked)
            $('#location_[<?php echo $row['location_id']; ?>]').fadeIn('slow');
        else
            $('#location_[<?php echo $row['location_id']; ?>]').fadeOut('slow');

    });
});

任何帮助非常感谢。感谢

Answer 1

目前您的PHP代码将被解释为字符串。

尝试将代码更改为：

$('#location_['+<?php echo $row["location_id"]; ?>+']').fadein('slow')

分别为淡出。

Answer 2

对于初学者...您的网页上的ID必须是唯一的。因此，您不能使用id =“location_1”的复选框，然后使用ID为“location_1”的div

拥有ID为“location_X”的复选框和带有“div_location_X”的div

我也会停止在javascript上使用php，除非你对php脚本执行ajax调用，或者你为每个复选框执行循环编写所有javascript，但它会更简单：

选中时（使用类将所有复选框组合在一起），您可以获取javascipt以获取复选框的id属性

    <input type="checkbox" id="location_1" name="location_1" class="check"/> </td>

$(document).ready(function(){
$('.check').change(function(){

if((.check).is(":checked"))
    var div_name = $(this).attr('id'); //this should come back with location_1 for the first checkbox
    $('#div_'+div_name+'').fadeIn('slow'); // prepend div_ for the corrent unique id name
else
    $('#div_'+div_name+'').fadeOut('slow');
  });
    });

使用chrome工具控制台进行调试

Answer 3

    <tr><td>
<input type="checkbox" id="location_<?php echo $row['location_id']; ?>" name="location_[<?php echo $row['location_id']; ?>]" class="check"/> </td>

$(document).ready(function(){
$('#location').change(function(){

        if((.check).is(":checked"))

            $('#location_[<?php echo $row['location_id']; ?>]').fadeIn('slow');
        else
            $('#location_[<?php echo $row['location_id']; ?>]').fadeOut('slow');

    });
});

Answer 4

1.您不能为div和复选框使用相同的ID，所以我将div id更改为location_div

$(document).ready(function(){
$(":checkbox").click(function () {

if($("input[id^='location_']:checkbox:checked").length>0)
{
    $("#location_div").removeAttr('style');
}
else
{
    $("#location_div").css({"display":"none"});
}


    });
});

显示div复选框已检查php

4 个答案: