jQuery中的detele函数动画问题

时间:2015-08-29 18:01:53

标签: javascript php jquery mysql ajax

我有以下脚本:

的index.php

<?php include("db.php"); ?>
<html>
    <head>
        <title>Title</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
    </head>
    <body>
        <div align="center">
            <table cellpadding="0" cellspacing="0" width="500px">

            <?php $sql = "SELECT * FROM items ORDER BY ID DESC";
              $items= mysql_query($sql);
              while ($item= mysql_fetch_array($items)){
                  $id = $item[ID]; ?>       

                  <tr style="border: solid 4px red;">
                      <td>
                          <div class="<?= $id ?>">
                              <button class="my-btn" type="button" value="<?= $id ?>">BUTTON <?= $id ?></button>
                          </div>
                      </td>
                  </tr>

            <?php } ?>

            </table>
            <div id="flash" align="left"  ></div>
            <ol  id="update" class="timeline"></ol>
            <div id="old_updates"></div>
        </div>

        <script src="script.js"></script>
    </body>
</html>

的script.js

$(function() {
    $(".my-btn").click(function() {
        var dataString = $(this).val();
        $("#flash").show().fadeIn(200).html('');
        $.ajax({
            type    : "POST",
            url     : "update_data.php",
            data    : {'not' : dataString},
            cache   : false,
            success : function(html){
                $("#update").prepend(html).find("li:first").slideDown("slow");
                $('#content').val('');
                $("#flash").hide();
            }
        });
    });

    $('.delete_update').live("click",function() {
        var ID = $(this).attr("id");
        var dataString = 'msg_id='+ ID;
        if(confirm("Sure you want to delete this update? There is NO undo!")){
            $.ajax({
                type    : "POST",
                url     : "delete_data.php",
                data    : dataString,
                cache   : false,
                success : function(html){
                    $(".bar"+ID).slideUp('slow', function() {$(this).remove();});
                }
            });
        }
        return false;
    });
});

update_data.php

<?php
    include('db.php');
    if(isSet($_POST['not'])) {
        $not    = $_POST['not'];
        mysql_query("insert into items (name) values ('$not')");
        $sql_in = mysql_query("SELECT wave, ID FROM actions order by ID desc");
        $r      = mysql_fetch_array($sql_in);
        $msg    = $r['name'];
        $id     = $r['ID'];
    }
?>

<li class="bar<?php echo $msg_id; ?>">
    <div align="left">
        <span style=" padding:10px"><?php echo $msg; ?> </span>
        <span class="delete_button">
            <a href="#" id="<?php echo $id; ?>" class="delete_update">X</a>
        </span>
    </div>
</li>

delete_data.php

<?php
    include("db.php");
    if($_POST['msg_id']) {
        $id  = $_POST['msg_id'];
        $id  = mysql_escape_String($id);
        $sql = "delete from items where ID='$id'";
        mysql_query( $sql);
    }
?>

我发布的代码更具体,易于理解。 该问题仅出现在删除功能中。 当我点击链接删除项目时,此项目不会立即消失,但会从sql数据库中删除。 要查看项目已删除,我需要刷新页面,我不希望这样。

我认为问题在于 script.js 的第二个功能,但我无法弄明白究竟是什么。

0 个答案:

没有答案