从 Ajax 更改按钮加载引导模式答案

【问题标题】：Loading bootstrap modal from Ajax change button从 Ajax 更改按钮加载引导模式
【发布时间】：2017-01-13 12:33:44
【问题描述】：

我正在使用按钮启动引导模式，然后通过 jQuery 更改按钮类和文本。更改按钮类后，我想启动另一个引导模式。

这是我的代码

$('.btn myBtn1').click(function () {
   var id = $(this).closest('tr').data('id');
$('#myModal1').data('id', id).modal('show');
 $('. btn').addClass(' myBtn2');
$('. btn').removeClass(' myBtn1');

});
//second modal code
$('.btn myBtn2').click(function () {
  var id = $(this).closest('tr').data('id');
$('#myModal2').data('id', id).modal('show');
 $('. btn').addClass(' myBtn1');
$('. btn'). removeClass(' myBtn2');

});

我的问题是它启动相同的模式。模态 1 并且从不加载模态 2。我应该怎么做才能解决这个问题？感谢您的时间。

【问题讨论】：

这个$('.btn myBtn2').click(...)被调用之前按钮有那个类，此时选择器不匹配任何东西。

标签： javascript jquery ajax twitter-bootstrap

【解决方案1】：

更改以下代码行：

//second modal code
$('.btn myBtn2').click(function () {

到

//second modal code
$(document).on('click', '.btn myBtn2', function(){

原因：当您动态更改选择器时，您必须让事件侦听器也能够处理它。 $('selector').click(); 仅适用于静态选择器。

【讨论】：

【解决方案2】：

您已动态更改按钮类，因此未附加客户端事件。在这种情况下，您将单击事件附加到父级而不是子级。更多信息In jQuery, how to attach events to dynamic html elements?

使用这个：

$('body').on('click', '.btn myBtn2', function () {

【讨论】：