html - 试图将 Bootstrap 模式放在按钮中

Question

有没有办法可以使用按钮（输入类型 =“按钮”）来显示引导模式。基本上默认是使用基于文档的锚。我尝试过尝试，但没有运气。

我不确定我的编码是否错误，或者 Bootstrap 模态只有在它是锚标记时才能被激活。我也尝试过谷歌搜索或研究是否有人创造了这种结果。

Answer 1

这应该与锚标记的工作方式相同。问题是，它基于 href 属性，指的是模式窗口的 id，并且将此属性放在按钮上可能会导致某些 html 验证变得不稳定。

如果你不关心那种东西，你可以用a标签替换你的button标签。

编辑：刚刚注意到您使用的是input元素而不是button. 无论哪种方式，它应该仍然有效。

Edit2：刚刚通过查看引导代码（2.3.2）验证了我所说的是否完全是 BS，并找到了这个片段：

$(document).on('click.modal.data-api', '[data-toggle="modal"]', function (e) {
    var $this = $(this)
      , href = $this.attr('href')
      , $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) //strip for ie7
      , option = $target.data('modal') ? 'toggle' : $.extend({ remote:!/#/.test(href) && href }, $target.data(), $this.data())

    e.preventDefault()

    $target
      .modal(option)
      .one('hide', function () {
        $this.focus()
      })
  })

看看这个，href 属性不是必需的，您可以data-target在使用输入和按钮时使用它。

Answer 2

只需您可以触发按钮单击事件并调用函数“onclick=showModal()”

JS代码

function showModal()
{

    $("#modal-window-id").modal("show");

}