Question

点击＆＃34;取消＆＃34;在警报窗口中，删除仍在进行中！我怎么解决这个问题？我正在使用MySQL数据库。工作测试待办事项列表：http://qrmobile.net/todo/index.php

删除下面的代码，然后索引页面代码......

新代码下面：ajax是否给我这个问题？

// Delete entry

$('a.deleteEntryAnchor').click(function() {
    var thisparam = $(this);
    thisparam.parent().parent().find('p').text('Please hold your onions.... ☺');
    $.ajax({
        type: "GET",
        url: thisparam.attr('href'),
        success: function() {
            thisparam.parent().parent().fadeOut('fast');
        }
    });
    return false;
});

require 'db.php';

$db = new Db();
$response = $db->delete_by_id($_GET['id']);
header("Location: index.php");

   <div id="container">
<header><img src="/todo/images/heading-trans.gif"></header>        

<ul id="tabs">
    <li id="todo_tab" class="selected">
        <a href="#">To-Do</a>
    </li>
</ul>

<div id="main">
    <div id="todo">

        <?php            
               require 'db.php';
               $db = new Db();
               $query = "SELECT * FROM todo ORDER BY id asc";
               $results = $db->mysql->query($query);

       if($results->num_rows) {
       while($row = $results->fetch_object()) {
       $title = $row->title;
       $description = $row->description;
       $id = $row->id;                              

        echo '<div class="item">';              
        $data = <<<EOD
<h4>$title</h4>
<p>$description</p>
<input type="hidden" name="id" id="id" value="$id" />

<div class="options">
<a class="deleteEntryAnchor" href="delete.php?id=$id">Delete</a>
<a class="editEntry" href="#">Edit</a>
<a class="save-button" href="index.php">Save</a>
</div>
EOD;
    echo $data;
    echo '</div>';
    } // end while
    }
    else {
    echo "<p>There are zero items. Add one now! </p>";
    }   
?>
    </div><!--end todo-->

<div id="addNewEntry">
        <h2>Add New Entry</h2>          
    <form action="addItem.php" method="post">           
        <p><label for="title"> Title</label>
        <input type="text" name="title" id="title" class="input" required/></p>                             
        <p><label for="description"> Description</label>
        <textarea name="description" id="description" required></textarea></p>                                                  
        <p><input type="submit" name="addEntry" id="addEntry" value="Add New Entry" /></p>                    
    </form>
</div><!--end addNewEntry-->            
</div><!--end main-->
</div><!--end container-->

<script>
//Do all this when the DOM is loaded
$(function() {
//get all delete links (Note the class I gave them in the HTML)
$("a.deleteEntryAnchor").click(function() {
   //Basically, if confirm is true (OK button is pressed), then
   //the click event is permitted to continue, and the link will
   //be followed - however, if the cancel is pressed, the click event will be stopped here.
   return confirm("Are you sure you want to delete this?");
});
});
</script>

Answer 1

它基本上你的js是问题所在，需要一个preventDefault，我认为，它并没有真正返回任何停止表单帖子的函数。

＆＃13;

$("a.deleteEntryAnchor").click(function(e){
        if(!confirm("Are you sure you want to delete this?")){
            e.preventDefault();
        }
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a class='deleteEntryAnchor' href='www.stackoverflow.com'>delete</a>

＆＃13;

Answer 2

$(function() {}只能防止你的javascripts在DOM加载完成之前尝试做的事情。

在大页面上，您的用户完全有可能快速点击该链接，以至于没有加载任何javascripts。因此浏览器在一半的时间内加载页面，用户发出命令转到另一个链接，因此通过重定向用户来完成正确的操作，而不是完成加载当前页面。

您希望在锚点的onclick属性（最安全）或jQuery单击函数中的e.preventDefault()上返回false。

如何使用确认提示窗口取消删除操作？

2 个答案: