如何将参数传递给jquery alert函数

Question

我有一个带有删除按钮的html表格。我想删除单击按钮时的行。为此，当我单击类为“.btn-danger”的按钮时，将打开一个JQuery警告窗口。我的问题是如何将单击按钮的$(this)传递给$.alert Yes函数，这样我就可以删除该行。下面是我的代码。

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.1.0/jquery-confirm.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.1.0/jquery-confirm.min.js"></script>

$(document).ready(function() {
    $('.btn-danger').on('click', function(e){
        e.preventDefault();
        var me = $(this);
        var id = $(this).closest('tr').attr('id');
        $.alert({
            title: 'Alert!',
            content: 'Are you sure you want to delete data?',
            buttons: {
                Yes: function (me) {
                    //pass value
                },
                No: function () {
                    //close function
                }
            }
        });
    });
});

Answer 1

从Yes: function (me) {}中删除me，因为您已经声明了它。然后你可以像下面这样叫它。

Yes: function() {
    console.log(me)
},

​

$('.btn-danger').on('click', function(e) {
  e.preventDefault();
  var me = $(this);
  var id = $(this).closest('tr').attr('id');
  $.alert({
    title: 'Alert!',
    content: 'Are you sure you want to delete data?',
    buttons: {
      Yes: function() {
        console.log(me)
        //$("tr#" + id).remove() <--- example of removing the row
      },
      No: function() {
        //close function
      }
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.1.0/jquery-confirm.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.1.0/jquery-confirm.min.css" rel="stylesheet" />

<button class="btn btn-danger">delete</button>

​

Answer 2

你可以尝试像下面这样的代码(如果我正确理解了你的问题)

$(document).ready(function() {
    $('.btn-danger').on('click', function(e){
        e.preventDefault();
        var me = $(this);
        $.alert({
            title: 'Alert!',
            content: 'Are you sure you want to delete data?',
            buttons: {
                Yes: function () {
                    me.closest('tr').remove();
                },
                No: function () {
                    //close function
                }
            }
        });
    });
});

jsfiddle example