無法引用動態添加的jQuery Mobile元素

Question

我在我的主html中添加了一個可摺疊按鈕和一個簡單的<a>元素。 的代碼如下：

var elements = ""; 

$('.button').bind('tap', function() { 
    elements += "<div class='my_clicker' data-role='collapsible'><h4>heading1</h4><h4>heading2</h4></div>"; 
    elements += "<a href='#' class='my_clicker'>Click me!</a>"; 
    $(".button_container").html(elements).trigger('create'); 
}; 

$(document.body).on('tap', '.my_clicker' ,function(){ 
    playAudio('success'); 
}); 

當我點擊<a>元素的音頻工作正常，所以它看起來一切正常，除了一個事實，即「.my_clicker」沒有引用我的可摺疊的元素，即可以」找到它。所以它看起來像常規的jQuery引用工作，但jQuery Mobile元素是不同的，不容易被引用。即使我在我的$(document.body).on()函數中使用'div'而不是'.my_clicker'，仍然所有div元素都會發出聲音，但我的可摺疊按鈕不會。 （我也試過，而不是「.my_clicker」「a」和「H4」）

在考察我的HTML元素在瀏覽器中，當我收縮元件上單擊表達::之前改爲突出我已經添加了<div>。

編輯：原來上面的代碼實際工作在我的平板電腦（如APK）儘管在瀏覽器不工作！不過，由於jQuery Mobile也可以用於Web應用程序，因此知道如何使其在瀏覽器中工作會很好。

Answer 1

你試過用live（）而不是on（）嗎？它適用於動態創建的元素。

http://api.jquery.com/live/