弹出窗口的显示ID按钮不起作用

Question

我有一个显示弹出窗口的按钮。我需要知道弹出窗口关闭后单击的按钮的ID。显示的警报没有ID 如何从第一个函数传递值ID以便在第二个函数中使用它？

带有弹出窗口的html中的按钮：

<p class="stop_inv">
<span class="glyphicon glyphicon-remove-sign" aria-hidden="true"></span>
Stop</p>

同一html中的弹出窗口：

<div class="modal fade" id="confirm-stop-automated-popup" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
<div class="modal-dialog" style="width:370px;" role="document">
<div class="modal-content">
    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
     <form class="form-horizontal" method="post" id="stop_automated">
<div class="modal-body">
     <div class="row">
        <h1 class="center" style="font-size:100%;">
            Do you wish to close them immediately ?
        </h1>
    </div>
    </div>
<div class="modal-footer">

    <button type="button" class="btn btn-primary" name="ok" data-dismiss="modal" id="confirm-stop-button">Ok</button>
    <button type="button" class="btn btn-primary" data-dismiss="modal" id="cancel-delete-button">Cancel</button>
  </div>
  </form>
</div>
</div>
</div>

我在javascript中的函数：（显示了弹出窗口，但我不知道单击了弹出窗口中的哪个按钮，应该在第二个函数中传递var信息以使用它的问题。

$('.automated-orders-list .stop').on('click', function() {
var $button = $(this);
var info = $button.closest('.data').attr('data-order-id');
    $('#confirm-stop-automated-popup').modal('show');
    e.preventDefault();
    return;
});

弹出窗口的第二个javascript知道单击哪个按钮不起作用：

$('#confirm-stop-automated-popup .modal-footer button').on('click', function(event) {

    var $button = $(event.target); // The clicked button

    $(this).closest('.modal').one('hidden.bs.modal', function() {
        // Fire if the button element 
        alert('The button that closed the modal is: ', $button);
    });

});

Answer 1

如果您的主要目的只是显示单击哪个按钮，则可以使用下面的代码来实现。

$('#confirm-stop-automated-popup .modal-footer button').on('click',
    function() {
        console.log('The button that closed the modal is: ' + this.innerText);
        //alert('The button that closed the modal is: ' + this.innerText);
    });

单击按钮时，您已经持有该按钮对象。通过this关键字，您可以读取该对象的属性。您无需通过event.target明确找到目标按钮。

$('#confirm-stop-automated-popup .modal-footer button').on('click',
    function(event) {
        var $button = this.innerText;

        $(this).closest('.modal').one('hidden.bs.modal', function() {
            // Fire if the button element 
            console.log('The button that closed the modal is: ' + $button);
        });

    });