如何确认并在点击事件中使用e.PreventDefault

Question

我正在尝试用jQuery实现一些非常基本的(在我看来)功能.我有Delete链接:

<a href="/Delete" class="prompt-for-delete">Delete</a>

而我想要的只是点击链接以显示某种确认窗口,如:

您确定要删除此内容:是/否

如果No单击,我想阻止链接执行.我使用jquery-1.10.2.min.js和 jquery-ui-1.10.3.min.js我的HTML是:

<div id="dialog-confirm" ></div>
<a href="/Delete" class="prompt-for-delete">Delete</a>

我尝试了几种在互联网上找到的选项.最后一个是:

$(document).ready(function () {

        $('.prompt-for-delete').click(function (e) {
            $("#dialog-confirm").dialog({
                resizable: false,
                height: 140,
                modal: true,
                buttons: {
                    "Delete all items": function () {
                        $(this).dialog("close");
                    },
                    Cancel: function () {
                        $(this).dialog("close");
                    }
                }
            });
        });

    });

这只是为了得到一些工作,但有了这个我打开对话框,并在一秒后自动关闭.这似乎是非常标准的东西所以你能提供一个如何实现这个目标的例子吗？

Answer 1

Confirm()是你在找什么.这是你如何使用它:

var answer=confirm('Do you want to delete?');

你的HTML就像:

<a id="delete" href="/Delete" class="prompt-for-delete">Delete</a>

而你的javascript:

$('#delete').on('click',function(e){
    e.preventDefault();
    var answer=confirm('Do you want to delete?');
    if(answer){
     alert('Deleted');
    }
    else{
        alert('Not Deleted');      
    }
});

你可以在这里看到演示:http://jsfiddle.net/c9cLW/1/

编辑:

这是更新的重定向和阻止事件:

脚本:

$('#delete').on('click',function(e){
    var answer=confirm('Do you want to delete?');
    if(answer){
     alert('Deleted');
    }
    else{
     e.preventDefault();      
    }
});

更新小提琴:http://jsfiddle.net/c9cLW/5/