javascript - 引导 onClick 按钮事件

Question

这似乎是一个愚蠢的问题，但只是得到了引导，它没有在网站上提供任何关于向按钮添加 Javascript 回调的示例......

尝试将我的按钮设置为 id 标志，然后

<div class="btn-group">
  <button id="rectButton" class="btn">Rectangle</button>
  <button class="btn">Circle</button>
  <button class="btn">Triangle</button>
  <button class="btn">Line</button>
  <button class="btn">Curve</button>
  <button class="btn">Pic</button>
  <button class="btn">Text</button>
  <button class="btn">Gradient</button>
</div>

我想为矩形按钮添加回调...

$('#rectButton').on('show', function (e) {
    //ACTION
})

无法理解引导回调的意义。

我在网上能找到的都是面向 Rails + Bootstrap 的……没有 bootstrap，只有 JS。

Answer 1

js中没有show事件 - 您需要将按钮绑定到click事件：

$('#id').on('click', function (e) {

     //your awesome code here

})

请注意，如果您的按钮位于 a 内form，您可能更愿意将整个表单绑定到submit事件。

Answer 2

如果像我一样，您在页面上动态创建了按钮，

$("#your-bs-button's-id").on("click", function(event) {
                       or
$(".your-bs-button's-class").on("click", function(event) {

方法不起作用，因为它们仅适用于当前元素（而不是未来元素）。相反，您需要引用在网页初始加载时存在的父项。

$(document).on("click", "#your-bs-button's-id", function(event) {
                       or more generally
$("#pre-existing-element-id").on("click", ".your-bs-button's-class", function(event) {

在此处和此处的堆栈溢出中，还有许多其他关于此问题的参考。