Question

我在模态弹出窗口中有一个带有Bootstraps按钮的母马。无论我做什么，我都无法点击事件。最新的Bootstrap，jQuery 1.7.1。

在模态中我有一个带按钮的页脚

<div class="modal-footer">
  <a href="#" class="btn cancelBtn">Cancel</a>
  <a href="#" class="btn dontSaveBtn">Don't Save</a>
</div>

我的JS无效（点击永远不会被解雇）

$("#navigate-away .cancelBtn").on("click", function(event){
  console.log('Click.');
  $('#navigate-away').modal('hide');
});

我可以通过使用悬停而不是点击来证明它的工作原理（hover fires ok）

$("#navigate-away .cancelBtn").on("hover", function(event){
  console.log('Click.');
  $('#navigate-away').modal('hide');
});

似乎内部吞下了click事件？我看到所有SO人都使用这种精确的方法没有问题。我错过了什么简单的事情？

Answer 1

这确实与另一个图书馆发生了冲突。这是一个令人震惊的调试，我最终在http://www.sprymedia.co.uk/article/Visual+Event使用Allan Jardine的Visual Event bookmarklet相对简单。谢谢艾伦，你救了我的熏肉。

Answer 2

尝试将preventDefault添加到您的点击事件，并更改为使用delegate绑定样式：

$("#navigate-away").on("click", ".cancelBtn", function(event){
  event.preventDefault();
  console.log('Click.');
  $('#navigate-away').modal('hide');
});

Bootstrap模态按钮不响应点击

2 个答案: