Question

我正在尝试创建一个jQuery函数，允许我在我的网站上添加，编辑和删除文章。现在，我正在尝试编写删除功能。基本上，当单击删除按钮时，它将通过ajax请求将该特定文章的id发送到php脚本。它从article元素的ID属性中获取文章ID。

我的问题是，当点击“删除”按钮时，我会在第一篇文章中找到包含文章ID的警告框，但不会显示其余部分。

这是我的代码：

HTML / PHP：

<div id="contentLeft">
            <?php
            foreach($data->blogPosts as $post){
            ?>
                <article id="<?php print $post->ID; ?>" class="article">
                    <div id="options">
                        <div id="edit"><a class="btn btn-danger" href="#" id="editButton"><i class="fa fa-pencil"> Edit</i></a></div>
                        <div id="delete"><a class="btn btn-danger" href="#" id="deleteButton"><i class="fa fa-trash-o">Delete</a></i></div>
                    </div>
                    <div id="articleTitle"><?php echo $post->Title; ?></div>
                    <div id="content">
                    <?php echo $post->Content; ?>
                    </div>
                    <div id="date"><?php echo date('F jS, Y', strtotime($post->Date)); ?></div>
                </article>
            <?php
            }
            ?>
    </div>

我的jQuery：

$("#deleteButton").bind('click', function(){
        var id = $("article").closest("article").attr("id");
        alert(id);
});

我很感激帮助！

Answer 1

您只能添加一个具有相同ID的元素。可能你应该将id更改为class：

<div class="delete"><a class="btn btn-danger" href="#" class="deleteButton"><i class="fa fa-trash-o">Delete</a></i></div>

并在您的js代码中：

$(".deleteButton").bind(...)

Answer 2

在给定的文档id中，s应该是唯一的;不超过一个元素应具有相同的ID。请将您的ID更改为班级并相应更改您的js：

<强> HTML

<a class="btn btn-danger deleteButton" href="#"> ....

<强> JS

$(".deleteButton").bind('click',...

jQuery .bind只处理第一个元素

2 个答案: