Jquery函数不能在Bootstrap模式下工作

Ale*_*der 3 jquery external modal-dialog twitter-bootstrap

我在我的proyect中使用Bootstrap v2.X,我想使用模态函数打开外部文件.

首先,我应该使用的代码是:

<a href="view_graphics.php" class="btn btn-warning btn-large" data-toggle="modal">Graphics</a>
Run Code Online (Sandbox Code Playgroud)

但它对我不起作用.然后我用:

<a href="view_graphics.php" id="graphics" class="btn btn-warning btn-large">Graphics</a>
Run Code Online (Sandbox Code Playgroud)

我把代码放到Jquery:

$('a#graphics').click(function(e) {
            e.preventDefault();
            var url = $(this).attr('href');
            if (url.indexOf('#') == 0) {
                $(url).modal('open');
            } else {
                $.get(url, function(data) {
                    $('<div class="modal hide fade modal-graphics">' + data + '</div>').modal();
                }).success(function() { $('input:text:visible:first').focus(); });
            }
        });
Run Code Online (Sandbox Code Playgroud)

它的工作原理!

好吧,但这不是主要问题.问题是当模态打开时,不能使用我的代码jQuery.

这是我的模态外部:

<div class="modal-header">
    <a class="close" data-dismiss="modal">x</a>
    <h3>Titulo modal</h3>
</div>
<div class="modal-body">
    <div class="window">
        <div class="nom_epi"></div>
    </div>
</div>
<div class="modal-footer">
    <a class="btn btn-primary" href="javascript:print();">Imprimir</a>
    <a class="btn" data-dismiss="modal">Cerrar</a>
</div>
Run Code Online (Sandbox Code Playgroud)

如果我把代码放在原始文件中:

$(document).ready(function() {
$('.nom_epi').click(function() { alert("hello"); });
});
Run Code Online (Sandbox Code Playgroud)

它不起作用!外部模态忽略原始文件的Jquery代码.这很奇怪,因为bootstrap CSS解释得很好.

我认为这是由于我用来打开外部模态的jQuery代码.

dav*_*rty 13

您将事件绑定到文档就绪,因此它仅绑定到当时存在的元素.我建议改用这个on()功能.

大卫在评论中提出的建议应该可以正常工作:

$('body').on('click','.nom_epi',function(){alert("hello");})

通常你会尝试将函数绑定到DOM树下面的某些东西,但这些模态通常是直接的子代 <body>