相关疑难解决方法(0)

在Twitter bootstrap中,查看模态文档.我无法弄清楚是否有办法收听模态的关闭事件并执行一个函数.

例如,我们以此模态为例:

<div class="modal-header">
    <button type="button" class="close close_link" data-dismiss="modal" aria-hidden="true">&times;</button>
    <h3>Modal header</h3>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
    <a href="#" class="btn close_link" data-dismiss="modal">Close</a>   
</div>

顶部的X按钮和底部的关闭按钮都可以隐藏/关闭模态data-dismiss="modal".所以我想知道,如果我能以某种方式听那个？

或者我可以像这样手动做,我猜...

$("#salesitems_modal").load(url, data, function() { 
     $(this).modal('show'); 
     $(this).find(".close_link").click(modal_closing);
});

你怎么看？

我有一个Boostrap Modal来选择事件.如果用户单击X按钮或模态外部,我想将它们发送到默认事件.我怎样才能捕获这些事件？

这是我的代码:

<div class="modal" id="myModal">
    <div class="modal-dialog">
        <div class="modal-content event-selector">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
                <center><h1 class="modal-title event-selector-text">Select an Event</h1><center>
            </div>
            <div class="container"></div>
            <div class="modal-body">
                <div class="event-banner">
                    <a href="/?event=1">
                        <img src="<?php echo IMAGES_EVENT1_LOGO; ?>" width="100%">
                    </a>
                </div>
                <div class="event-banner">
                    <a href="/?event=2">
                        <img src="<?php echo IMAGES_EVENT2_LOGO; ?>" width="100%">
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>

我的目标是在Bootstrap模式关闭时重新加载页面.用户可以通过单击关闭按钮或图标或单击远离模态来关闭模态.

到目前为止,我的代码非常标准.取自:http: //getbootstrap.com/javascript/#modals

<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
  Launch
</button>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">My title</h4>
      </div>
      <div class="modal-body">
        My content
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save</button>
      </div>
    </div>
  </div>
</div>

如何在关闭模式后重新加载页面？

更新:哇,来自每个人的惊人快速反应.谢谢

我有一个函数绑定到隐藏模式对话框的操作.

我使用的代码类似于此问题的接受答案.

$('#myModal').on('hidden', function () {
    // do something…
})

但是,此对话框可能会重新打开以进行编辑,并且当发生这种情况时,我不一定要运行此代码.有没有办法"取消绑定"该功能,以便在对话框关闭时不再运行该功能？我在文档中没有找到任何内容.

使用Bootstrap v3.3.5

我有一个使用网址的网页 domain.com/companies

这是我在该网页中模式的触发器.

<a href="#modal-add-company" class="btn btn-effect-ripple btn-effect-ripple btn-success" data-toggle="modal"><i class="fa fa-plus"></i> New Company</a>

这将成功触发此模态

<div id="modal-add-company" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">

但是,网址不会更改为 domain.com/companies#modal-add-company

url domain.com/companies#modal-add-company实际上也不会在重新加载时触发模态.

如何进行以下操作我需要做什么:

1. domain.com/companies#modal-add-company每次触发模态时都会更改网址,并显示模态,并且
2. 如果我直接输入网址domain.com/companies#modal-add-company,则显示模态

http://react-bootstrap.github.io/components.html#modals - 我正在寻找一种方法来查找'shown.bs.modal'而不是'show.bs.modal'的触发事件.

我没有看到任何关于某些bootstrap模态事件的文档:http://getbootstrap.com/javascript/#modals-events

var NewPerson = React.createClass({

  getInitialState: function(){
    return { showModal: false };
  },

  componentDidMount: function() {
    // removed irrelevant code
  },

  close: function(){
    this.setState({ showModal: false });
  },

  open: function(){
    this.setState({ showModal: true });
  },

  submit: function(e) {
    // removed irrelevant code
  },
  render: function() {
    var Button = ReactBootstrap.Button;
    var ButtonInput = ReactBootstrap.ButtonInput;
    var Modal = ReactBootstrap.Modal;

    return (
      <div>
        <Button
          className="pull-right bottom-20"
          bsStyle='success'
          bsSize='large'
          onClick={this.open}
        >
          Create New Person
        </Button>

        <Modal id="new-person-modal" …

在我目前的项目中,我使用bootbox来替换旧的普通警报,并确认盒子是时髦的.但问题是在关闭或解除bootbox之后它的焦点不会返回到我的输入.

    bootbox.alert("Please create a milestone");
    $('input[name="mile_stone[]"]:first').focus();
    return false;

除焦点功能外,一切都按预期工作.有什么方法可以解决这个问题吗？

我试图在我的页面上关闭Bootstrap模式后执行一些jQuery代码,我在我的jQuery和所有内容中都有模态的id.我想使用某种类型的jQuery函数,而不是条件if语句.这是我打开的模式,如何在关闭后运行一些jQuery(动画应该是完整的和一切)？

<div id="part_number-modal" class="modal fade in" tabindex="-1" role="dialog" aria-labelledby="part_number-modal" aria-hidden="false" style="display: block;">
<!-- the rest of the modal HTML is in here -->
</div>

bootbox当用户通过“x”按钮关闭对话框时，是否有调用函数的选项？使用bootbox.dialog().

有没有这样的：

bootbox.dialog({
    message : 'My message',
    callback : function() {
        // User is closin' the dialog. Come on do somethin'
    }
});

我什至尝试过close,closing而closeCallback不是callback，但他们都没有工作。