jQuery事件流

在伪代码中，这是我想要做的:

In pseudocode, here's what I want to do:

1. 向Google Map添加一堆标记
2. 向每个标记添加点击侦听器-侦听器将打开jQuery Mobile对话框页面
3. 对话页面一旦上线(对于布局而言很重要)，请进行Ajax调用，并使用附加到标记的ID来设置img标记的src属性.

1. Add a bunch of markers to a Google Map
2. Add a click listener to each marker - the listener opens a jQuery Mobile dialog page
3. Once the dialog page is live (important for layout purposes), make an Ajax call and set the src attribute of an img tag, using an ID attached to the marker.

不过，我发现管理事件流程有些困难.

I'm finding managing the flow of events a bit difficult, though.

// Set up value of HTML elements inside dialog
// Should call after the dialog is live,
// otherwise layout breaks horribly. 
function setUpPhoto(id) {
    // Cut for brevity: Ajax call to get URL.
    $('#photo-image').attr({ src: image_url  });
}
// Add a map marker and listeners
function addNewMarker(v) { 
    var map_marker = new google.maps.Marker({
       position: v.latlng,
       title: v.caption
    });
    map_marker.setMap(map); 
    // Add a click listener for each marker
    // This should show the dialog, and then set it up, using the appropriate ID.                           
    google.maps.event.addListener(map_marker, 'click', function() {
        // Show the dialog
        $.mobile.changePage($("#photo"), 'pop', false, true);
        // ISSUE - how to call this only after the dialog is live?
        setUpPhoto(v.id);
        // ... could attach it like this, but how to do for each marker?
        $('#photo').live('pageshow', function (event, ui) { 
            getIndividualPhoto(v.id, '');
    });
    });
 }
 $.each(data.marker, function(i,v) {
     addNewMarker(v);
 });           

这是简化的代码-我遇到问题的实际页面位于 http://cyclestreets. darkgreener.com/location/(滚动到英国伦敦的位置以查看一些标记)

This is simplified code - the actual page where I'm having the issue is at http://cyclestreets.darkgreener.com/location/ (scroll to a London, UK location to see some markers)

感谢您的帮助.