如何在输入单击时触发模态?

Pey*_*ahy 1 jquery bootstrap-modal twitter-bootstrap-3

当我点击文本输入时,我想要触发器bootstrap模式,我怎么能用jquery做到这一点?

<div id="myModal" class="modal fade" role="dialog">
Run Code Online (Sandbox Code Playgroud)

<!-- Modal content-->
<div class="modal-content">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal">&times;</button>
    <h4 class="modal-title">Modal Header</h4>
  </div>
  <div class="modal-body">
    <p>Some text in the modal.</p>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

Sch*_*lzy 5

您也可以使用数据属性,不需要额外的jQuery.虽然如果用户选中输入而不是点击输入,我认为不会触发.

<input type="text" data-toggle="modal" data-target="#myModal">
Run Code Online (Sandbox Code Playgroud)

DEMO

无需编写JavaScript即可激活模态.在控制器元素上设置data-toggle ="modal",如按钮,以及data-target ="#foo"或href ="#foo",以定位要切换的特定模态.