Jquery - 单击时不调用函数

时间:2014-12-08 17:46:31

标签: javascript jquery html

我正在更改div的innerHTML,然后使用新创建的HTML我正在调用函数,但由于某种原因,该函数未被调用。以下是我的工作。这是Fiddle



$('#click1').click(function () {
    $('#submit').html('this is new html <br /><a href="javascript:;" id= "click2">Click here 2nd</a>')

});

$('#click2').click(function(){
alert("all is well");
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="submit">
    <a href = "javascript:;" id="click1">Click here</a>
</div>
&#13;
&#13;
&#13;

5 个答案:

答案 0 :(得分:5)

由于您动态生成了click2,因此您应该delegate。试试这个

$('#submit').on('click', '#click2',function(){
    alert("all is well");
});

答案 1 :(得分:0)

这是jsfiddle

$(document).on('click','#click2',function(){
  alert("all is well");
});

答案 2 :(得分:0)

HTML

<div id="submit">
    <a href="#" id="button1">Click here</a>
</div>

JS

$('#button1').on('click', function(){
    $(this).replaceWith('HTML HERE');
});

http://jsfiddle.net/z725dpLa/6/

答案 3 :(得分:0)

您的代码无法正常工作的原因是您正在为尚未存在的对象分配事件处理程序。只需将click2事件处理程序移动到click事件处理程序中,就像这样。

$('#click1').click(function () {
    $('#submit').html('this is new html <br /><a href="javascript:;" id="click2">Click here 2nd</a>')
    $('#click2').click(function(){
    alert("all is well");
    });
});

答案 4 :(得分:0)

您无法将EventHandler附加到未创建的DOM元素。因此,在将新链接插入DOM后,您需要附加click2 - 处理程序!

$('#click1').click(function () {

    $('#submit').html('this is new html <br /><a href="javascript:;" id= "click2">Click here 2nd</a>');
    $('#click2').click(function(){
      alert("all is well");
    });
});