在Rails的确认对话框中单击“取消”时触发“单击”事件

Question

我正在使用这个gem（ https://github.com/bluerail/twitter-bootstrap-rails-confirm ）用引导程序模式替换标准浏览器确认对话框，并且它可以工作，但是，没有内置的当“确定”或“取消”按钮被选中时回调，所以我试图创建自己的按钮。

我当前正在单击原始链接时将其禁用，以防止用户单击它两次，但是，如果在确认对话框中单击“取消”，则需要重新启用该链接。 这是我尝试的：

$('#confirmation_dialog').find('.cancel').on 'click', (e) ->
    console.log('cancel was clicked')
    $('.disabled').removeClass('disabled')

问题是，单击“取消”按钮/链接时，该命令无法运行。

使用Chrome JS控制台时，我在模态上找到正确的“取消”按钮并使用进行调用时没有问题

$('#confirmation_dialog').find('.cancel').click()

它可以有效地取消和关闭模式，但是不会触发我的on click事件，因此不会重新启用该按钮。

这是页面上供用户单击的链接：

<td><%= link_to 'Cancel Appt', cancel_appointment_path(appointment), class: 'btn btn-default btn-xs btn-danger btn-disable-after-click', data: { confirm: "Are you sure you want to cancel the appointment?", commit: 'Yes', cancel: 'No' } %></td>

并且禁用了该按钮，因此用户无法两次单击它：

$('.btn-disable-after-click').on 'click', (e) ->
    $(this).addClass('disabled')

关于我在做什么错的任何建议，将不胜感激，谢谢！

Answer 1

是因为元素（例如$('#confirmation_dialog').find('.cancel') ）在绑定到该点时不存在？

您可以通过指定选择器来使用jQuery的on方法动态绑定到事件，如下所示：

$('body').on 'click', '#confirmation_dialog .cancel', (ev) ->
    $('.disabled').removeClass('disabled')

这似乎是可能的原因，因为通常使用JavaScript将对话框添加到页面中，因此最初在DOM中不存在。 尽管难以确定，但没有看到完整的源代码。