关于javascript:将bootbox.js确认框添加到href链接

Add bootbox.js confirmation box to href link

我使用一些href选项卡在html表的所有行上绘制按钮。 当用户单击行按钮时,它将使用HTML GET将用户重定向到具有某些行值的另一个PHP脚本。 但是在我当前的实现中,当用户单击按钮时,没有确认。 我添加了基本的javascript确认框,但这非常基本,浏览器每次都要求停止弹出警报。

因此,我没有使用普通的javascript,而是找到了一个名为bootbox.js的库,该库是专为CSS警报和确认框设计的。 但是,当我在当前的jquery实现中应用bootbox方法时,它不起作用!

引导箱-引导箱文档

下面是我的代码:

这是我的href代码,使html链接

1
echo"Approve";

这是我的jQuery代码部分,其中包含bootbox调用。

1
2
3
4
<script type="text/javascript">
    $('.confirmation').on('click', function () {
          return bootbox.confirm('Are you sure?');
    });


  • 您应避免单击链接的默认行为(否则浏览器会将您重定向到该链接)。
  • confirm函数应接收一个回调函数(用于处理确认结果)。
  • 检查此示例:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    $('.confirmation').on('click', function (e) {
      e.preventDefault();
      href = $(this).attr('href');
      return bootbox.confirm('Are you sure?', function(result) {
        if (result) {
          window.location = href
        }
      });
    });
    1
    2
    3
    4
    5
    6
    7
    8
    9
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
    <script type='text/javascript' src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js">
    <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.11.2/css/bootstrap-select.min.css">


    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js">

    Approve