Question

有问题。我需要从MySQL查询提供的结果列表中单击按钮来删除关联的元素。单击“删除”按钮时，仅隐藏第一个图像。返回的其余图像什么都不做。

这是我的代码：

PHP：

<?php 
while ($image_row = mysqli_fetch_array($image_result)) { ?>
<span class="listing_image_preview" id="image_<?php echo $image_row['id']; ?>">
<img src="<?php echo $image_row['image_thumb']; ?>" style="border:6px solid #EEE; margin:6px;" />
<button id="remove_image" class="btn btn-default btn-xs" imageId="<?php echo $image_row['id']; ?>">Remove</button>
</span>
<?php
}
?>

jQuery的：

$(document).ready(function() {
    $("#remove_image").click(function() {

        var image_id = $(this).attr('imageId');

        $('#image_'+image_id).hide();
    })
});

Answer 1

您的所有按钮都具有相同的ID：

<button id="remove_image"

您的jquery脚本只会找到一个带有以下选择器的元素：

$("#remove_image")

以下是解决问题的一种方法：

将remove_on_click添加到按钮的课程中（我也将ID设为唯一）


    <?php 
    while ($image_row = mysqli_fetch_array($image_result)) { ?>
    <span class="listing_image_preview" id="image_<?php echo $image_row['id']; ?>">
    <img src="<?php echo $image_row['image_thumb']; ?>" style="border:6px solid #EEE; margin:6px;" />
    <button id="remove_image_<?php echo $image_row['id']; ?>" class="btn btn-default btn-xs remove_on_click" imageId="<?php echo $image_row['id']; ?>">Remove</button>
    </span>
    <?php
    }
    ?>

在您的jquery脚本中选择课程remove_on_click：



    $(document).ready(function() {
        $(".remove_on_click").click(function() {

            var image_id = $(this).attr('imageId');

            $('#image_'+image_id).hide();
        })
    });

jQuery隐藏相关PHP MySQL的Div导致While循环

1 个答案: