从模态打开bootstrap模态

Question

我试图从实际打开的模态视图打开新的引导模态视图。

我用下面的模板来打开我的所有不同模态：当我按下一个模式内的按钮

<a href='<%= url_for :controller => :customers, :action => :new %>' data-target='#myModal' type='button' class='btn' role='button' data-toggle='modal'> 
    <i class="icon-plus"></i> new Customer</a> 

实际上，：

<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
    <h3 id="myModalLabel">&nbsp;</h3> 
    </div> 
    <div class="modal-body"> 
    <div class="alert alert-error" style="text-align: center;"> 
     <strong>ERROR!</strong><br />You should not be able to see this text!^ 
    </div> 
    </div> 
</div> 
<script> 
    $("a[data-target=#myModal]").click(function(ev) { 
     ev.preventDefault(); 
     var target = $(this).attr("href"); 

     // load the url and show modal on success 
     $("#myModal .modal-body").load(target, function() { 
      $("#myModal").modal("show"); 
     }); 
    }); 
</script> 

然后，我打电话给我的情态动词与回报率像那样，没有任何反应。

Answer 1

首先，当您使用自己的模态加载时，不应该使用data-toggle="modal"属性，因为远程页面将被加载两次（通过您和插件）。

其次，当你绑定的事件，它仅使用的元素已经在页面上，除非您使用delegated events，如：

$(document).on('click','a[data-target="#myModal"]', function(ev) { 

}); 

公告简单的报价'周围的选择和双引号"周围的属性值。

从那里，它应该工作：Demo (jsfiddle)