Javascript 未执行Ajax代码

因此，我试图通过ajax从表中删除数据。我在网上找到了本教程，但当我单击“删除”按钮时，它只会将我带到页面顶部，而不是删除我的数据。它还会在控制台中抛出一个未定义的元素错误。任何帮助都将被感激地接受

<?php
$sql = "SELECT id,title,location,date,fb_page FROM gigs order by id desc ";
$result = mysql_query($sql) or trigger_error(mysql_error() . $sql);

while ($row = mysql_fetch_array($result)) {
echo '<tr>';
echo '<td>'.$row['id'].'</td>';
echo '<td>'.$row['title'].'</td>';
echo '<td>'.$row['location'].'</td>';
echo '<td>'.$row['date'].'</td>';
echo '<td>'.$row['fb_page'].'</td>';
echo '<td> <div><a href=gigpic.php?id=' . $row['id'] . ' class="group1"><img class="img-responsive"  src=gigpic.php?id=' . $row['id'] . ' height="50%" width="50%"></a></div> </td>';
?>

 <td><a href="#" id="<?php echo $row['id']; ?>" class="delbutton"><i class="fa fa-trash-o fa-fw fa-3x"></i></a>
 <div><a href="update_event.php?id=<?php echo $row['id'] ?>" class="iframe" ><i class="fa fa-refresh fa-fw fa-3x"></i></a></div></td>
            <?php
            echo '</tr>';
            }
            ?>

我的Javascript

<script type="text/javascript" >
$(function() {

    $(".delbutton").click(function() {
        var del_id = element.attr("id");
        var info = 'id=' + del_id;
        if (confirm("Sure you want to delete this update? There is NO undo!")) {
            $.ajax({
                type : "POST",
                url : "delete_event.php",
                data : info,
                success : function() {
                }
            });
            $(this).parents(".record").animate({
                backgroundColor : "#fbc7c7"
            }, "fast").animate({
                opacity : "hide"
            }, "slow");
        }
        return false;
    });
});
</script>

---

元素未定义，这正是它所说的。您有一个未定义的名为element的变量

var del_id = element.attr("id");

您可能打算这样做：

var del_id = $(this).attr("id");

---

好的，到目前为止，我看到元素的一个缺少的引号被定义在某个地方？谢谢Brian的工作。但是你能告诉我为什么删除后不隐藏那一行。我必须不断刷新页面才能看到更新的数据，因为你没有告诉它。您可以通过放置$this.parent.parent.remove轻松删除该行；在成功函数内部。