Question

我正在为我的项目使用bootsrtap。当我在javascript中使用innerHtml替换某些部分时，它将无效。

<div id="confirm_body">  
                <div class="modal-body">
                    <p>Enter the email configured in your profile. A password reset link will be sent to by email. </p>
                    <label>User Name</label>
                    <input class="login-class" type="text" name="username" id="username"  size="30"/>
                    <label>Enter email address</label>
                    <input class="login-class" type="text" name="emailAdd" id="emailAdd"  size="30"/>
                </div>
                <div class="modal-footer">
                    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
                    <button class="btn btn-primary" id="sendConfMail">Submit</button>
                </div>
             </div>

但在我更换之后使用javascript，

  document.getElementById('sendConfMail').onclick=function(){
                            document.getElementById('confirm_body').innerHTML='<div class="modal-body"><div class="alert alert-success"> Your confirmation email sent! </div>   </div><div class="modal-footer"><button class="btn" data-dismiss="modal" aria-hidden="true">Close</button></div>';
                            };

在此之后，当我点击ID = sendConfMail的按钮时，没有任何事情发生。这是为什么？

Answer 1

尝试在JQuery中使用它：

$("#sendConfMail").click(function(){
$("#confirm_body").html('<div class="modal-body"><div class="alert alert-success"> Your confirmation email sent! </div>   </div><div class="modal-footer"><button class="btn" data-dismiss="modal" aria-hidden="true">Close</button></div>')

});

Answer 2

从您发布的代码中使用innerHTML的位置并不明显，但重要的是要知道使用innerHTML = foo;使用该代码将删除您创建的任何事件处理程序，并且不允许您创建除内联javascript之外的新事件处理程序。

使用innerhtml后，单击按钮将不会响应

2 个答案: