javascript - JQuery 单击事件在引导模式中不起作用

Question

我的页面中有这行代码:

<div id='data'>...</div>      
<a id='addMore' href='#'>Add more </a>   

这一行实际上是在引导模式中。我希望当用户单击它时，我希望它上面的 div 被克隆。问题不在于克隆代码，而在于甚至没有引发点击事件。在我的 .js 文件中，我有这个:

$('#addMore').click (...)

省略号代表防止默认和克隆的代码。我尝试使用警报进行测试。它仍然没有用。我不知道为什么。

我发现如果我在标签中添加 onClick='alert(...)，它就会起作用。

有人能帮忙吗？

这是模态的 HTML(不介意是否有人帮助格式化。我知道它很乱):

<div id="addEmailModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="addEmailLabel" aria-hidden="true">   
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times; </button> 
        <h3 id="addEmailLabel">Add Email</h3>
    </div>
    <div class="modal-body">
        <div id="emailData">
            <input type="text" placeholder="Name (optional)" class="input-xlarge" />
            <input type="email" placeholder="Email" />
        </div>
        <a id="addMore" href="#">Add more&hellip;</a>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
        <button class="btn btn-primary" id="btnAdd">Add</button>
    </div>
</div>

Answer 1

$(document).on('click', '#addMore', function(){...});

Modal 还没有准备好 $(document).ready 函数。当它弹出时它就准备好了。这就是这背后的原因。