Javascript JQuery Mobile-列表项的单击事件未更改

我正在使用一个简单的JQuery移动页面，如下所示：

<div data-role="page" id="myuploads">
    <div data-role="header" data-id="header" data-position="fixed">
         <div data-role="navbar">
            <ul>
            </ul>
        </div><!-- /navbar -->
    </div>
    <div data-role="content">
        <ul data-role="listview" data-theme="a" id="myuploadlist">
        </ul>
    </div>
    <div data-role="footer">
    </div>
</div>

然后我运行这个javascript代码来填充页面列表，并应用点击功能。这会将用户带到另一个页面以显示已上载的图像。它通过列表项的ID来实现这一点，该ID随后存储在localstorage中并用于填充页面

 $("#myuploads").live("pageinit", function() {

//retrieve details from local storage (logged in)
var userid = JSON.parse(localStorage.getItem("userid"));

console.log(userid);

//serialise post data manually
var postData = 'userid=' + userid;

$('body').addClass('ui-loading');

$.ajax({
    type: 'POST',
    data: postData,
    url: 'MYURLREMOVED',
    success: function(data){
        $('body').removeClass('ui-loading');
        //alert("success");
        $('#myuploadlist').append('<li>Active</li>');

        for (var i = 0; i < data.length; i++) {
            $('#myuploadlist').append('<li><a href="index.html#image" id="' + data[i].Details.File + '">Upload: ' + data[i].UploadID + ' - ' + data[i].Details.TotalViews + ' Views</a></li>');
        }
        $('#myuploadlist').listview('refresh');
    },
    error: function(){
        $('body').removeClass('ui-loading');
        //alert("failure");
        $('#myuploadlist').append('<li>Cannot Load Uploads</li>');
        $('#myuploadlist').listview('refresh');
    }
});

$('#myuploadlist').on('click', 'a', function() {
    var elementID = $(this).attr('id');
    $(document).on('click', '#'+elementID, function(event){
        if(event.handled !== true) // This will prevent event triggering more then once
        {

            localStorage.setItem('selectedImage', elementID);
            //console.log("stored: " + localStorage.getItem('selectedImage'));
            //The below code is handled in a href when list is generated
            //$.mobile.changePage( $("userprofile"), "slide", true, true);
            event.handled = true;
        }
    });
});

})

然而，这只是第一次起作用。当我单击“上一步”并单击一个新的列表项时，它仍然显示以前显示的图像。我知道列表ID已正确分配

---

这是实现我想做的事情的正确方法吗？你能看出我的事件有什么问题吗？谢谢。

使用了jQ和jQM版本？稍旧的版本我想Omar、jquery mobile 1.2.1版和jquery 1.8.3版您有什么解决方案吗？我也有同样的问题。