Question

我希望在点击新代码获取警报后用其他代码替换代码，但在我的代码中不起作用警报。怎么能解决它？

HTML

<select>
    <option>select 1</option>
    <option>select 2</option>
    <option>select 3</option>
</select>
<div class="dfg"><a href="#">Test</a></div>

jQuery的：

$('select').on('change', function(){
    //alert('ook');
    $('.dfg a').replaceWith('<a href="#" class="pon">Link</a>')
});
$('.pon').on('click', 'a', function(){
    alert('ook');
});

Answer 1

那是因为在你的标记中a.pon没有类pon的父元素，所以应该从元素或文档对象的静态父类之一委托事件。

变化：

$('.pon').on('click', 'a', function(){

要：

$(document).on('click', 'a.pon', function(){

或者：

$('.dfg').on('click', 'a.pon', function(){

Answer 2

试试这个：

$(document).on('click', '.pon', function(){
    alert('ook');
});

Answer 3

您正在从DOM中删除元素，因此您必须重新绑定。

$('select').on('change', function(){
        //alert('ook');
        $('.dfg a').replaceWith('<a href="#" class="pon">Link</a>');
        BindLink();
    });

function BindLink(){
    console.log("in link");
    $('.pon').on('click', function(e){
        e.preventDefault();
        alert('ook');
    });
}

请参阅此小提琴fiddle Update

Answer 4

$('select').on('change', function(){
    //alert('ook');
    $('.dfg a').replaceWith('<a href="#" class="pon">Link</a>')
});
$('body').delegate('.pon','click', function(){
    alert('ook');
});

ReplaceWith并在jQuery中提醒消息

4 个答案: