jquery - 元素未由附加事件处理程序触发

Question

我有一个<div id="pause"><img id="pausimg" src="bla" /></div>作为触发我以下事件的按钮:

$('#pause').on('click', pause);
$('#play').on('click', play);

function pause() {
    $slider.cycle('resume'); 
    $('#pausimg').attr('src', 'images/pause.png'); 
    $(this).attr('id', 'play');
}

function play() { $slider.cycle('pause');
     $('#pausimg').attr('src', 'images/play.png');
     $(this).attr('id', 'pause');
}

如您所见#play单击按钮时不存在。但单击它后，处理程序 play()应该开火。但它似乎不知道#play即使我检查日志 id实际上是#play

谢谢

Answer 1

<强> Working jsFiddle Demo

使用事件委托(delegate):

$('body').on('click', '#pause', pause);
$('body').on('click', '#play', play);

<小时/>

引用文献:

• .on() - jQuery API 文档