我可以很容易地使用bootbox.js库处理这种类型的任务。首先，你需要包括引导框JS文件。然后在你的事件处理函数中简单地写以下代码:

    bootbox.confirm("Are you sure to want to delete , function(result) {

    //here result will be true
    // delete process code goes here

    });

官方引导盒js 网站

POST配方导航到目标页面和可重用的刀片文件

Dfsq的回答非常好。我对它做了一些修改，以适应我的需求:我实际上需要一个模式，在点击之后，用户也会被导航到相应的页面。异步执行查询并不总是需要的。

使用Blade我创建了文件资源/views/includes/confirmation_modal.blade.php:

<div class="modal fade" id="confirmation-modal" tabindex="-1" role="dialog" aria-labelledby="confirmation-modal-label" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4>{{ $headerText }}</h4>
            </div>
            <div class="modal-body">
                {{ $bodyText }}
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <form action="" method="POST" style="display:inline">
                    {{ method_field($verb) }}
                    {{ csrf_field() }}
                    <input type="submit" class="btn btn-danger btn-ok" value="{{ $confirmButtonText }}" />
                </form>
            </div>
        </div>
    </div>
</div>

<script>
    $('#confirmation-modal').on('show.bs.modal', function(e) {
        href = $(e.relatedTarget).data('href');

        // change href of button to corresponding target
        $(this).find('form').attr('action', href);
    });
</script>

现在，使用它很简单:

<a data-href="{{ route('data.destroy', ['id' => $data->id]) }}" data-toggle="modal" data-target="#confirmation-modal" class="btn btn-sm btn-danger">Remove</a>

这里没有太多变化，模态可以像这样包含:

@include('includes.confirmation_modal', ['headerText' => 'Delete Data?', 'bodyText' => 'Do you really want to delete these data? This operation is irreversible.',
'confirmButtonText' => 'Remove Data', 'verb' => 'DELETE'])

只要把动词放在那里，它就会用到它。这样，也可以利用CSRF。

帮了我，也许也能帮到别人。

我可以很容易地使用bootbox.js库处理这种类型的任务。首先，你需要包括引导框JS文件。然后在你的事件处理函数中简单地写以下代码:

    bootbox.confirm("Are you sure to want to delete , function(result) {

    //here result will be true
    // delete process code goes here

    });

官方引导盒js 网站

多亏了@Jousby的解决方案，我设法让我的工作也很好，但我发现我必须改进他的解决方案的Bootstrap模式标记，使其像官方示例中演示的那样正确呈现。

所以，这是我修改后的泛型确认函数，它工作得很好:

/* Generic Confirm func */
  function confirm(heading, question, cancelButtonTxt, okButtonTxt, callback) {

    var confirmModal = 
      $('<div class="modal fade">' +        
          '<div class="modal-dialog">' +
          '<div class="modal-content">' +
          '<div class="modal-header">' +
            '<a class="close" data-dismiss="modal" >&times;</a>' +
            '<h3>' + heading +'</h3>' +
          '</div>' +

          '<div class="modal-body">' +
            '<p>' + question + '</p>' +
          '</div>' +

          '<div class="modal-footer">' +
            '<a href="#!" class="btn" data-dismiss="modal">' + 
              cancelButtonTxt + 
            '</a>' +
            '<a href="#!" id="okButton" class="btn btn-primary">' + 
              okButtonTxt + 
            '</a>' +
          '</div>' +
          '</div>' +
          '</div>' +
        '</div>');

    confirmModal.find('#okButton').click(function(event) {
      callback();
      confirmModal.modal('hide');
    }); 

    confirmModal.modal('show');    
  };  
/* END Generic Confirm func */

http://bootboxjs.com/ - Bootstrap 3.0.0的最新作品

最简单的例子:

bootbox.alert("Hello world!"); 

来自网站:

该库公开了三种用于模拟原生JavaScript等价物的方法。它们确切的方法签名是灵活的，因为每个方法都可以接受各种参数来定制标签和指定默认值，但它们通常是这样被称为:

bootbox.alert(message, callback)
bootbox.prompt(message, callback)
bootbox.confirm(message, callback)

下面是运行中的代码片段(点击下面的“运行代码片段”):

$(function() { bootbox.alert("Hello world!"); }); <!-- required includes --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"/> <!-- bootbox.js at 4.4.0 --> <script src="https://rawgit.com/makeusabrew/bootbox/f3a04a57877cab071738de558581fbc91812dce9/bootbox.js"></script>

我意识到这是一个非常古老的问题，但自从我今天想知道一个更有效的方法来处理引导情态动词。我做了一些研究，发现了一些比上面显示的解决方案更好的方法，可以在这个链接中找到:

http://www.petefreitag.com/item/809.cfm

首先加载jquery

$(document).ready(function() {
    $('a[data-confirm]').click(function(ev) {
        var href = $(this).attr('href');

        if (!$('#dataConfirmModal').length) {
            $('body').append('<div id="dataConfirmModal" class="modal" role="dialog" aria-labelledby="dataConfirmLabel" aria-hidden="true"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button><h3 id="dataConfirmLabel">Please Confirm</h3></div><div class="modal-body"></div><div class="modal-footer"><button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button><a class="btn btn-primary" id="dataConfirmOK">OK</a></div></div>');
        } 
        $('#dataConfirmModal').find('.modal-body').text($(this).attr('data-confirm'));
        $('#dataConfirmOK').attr('href', href);
        $('#dataConfirmModal').modal({show:true});
        return false;
    });
});

然后向href询问任何问题/确认即可:

<a href="/any/url/delete.php?ref=ID" data-confirm="Are you sure you want to delete?">Delete</a>

通过这种方式，确认模式更加通用，因此可以很容易地在网站的其他部分重复使用。