jQuery dialog breaking after closing - I'm using dialog destroy
I've got a few demo videos I've been making as tutorials, and I'm using a link to open a dialog box and put the demo video in that box.
I use the same div to show other notes on the page when a user selects to view a complete note.
The code I use to show the notes is
jQuery('span.Notes').live('click', function(){ var note=jQuery(this).data('note'); jQuery('div#showNote').text(note); jQuery('div#showNote').append(''); jQuery('div#showNote').dialog({ modal: true, close: function(){ jQuery('div#showNote').dialog('destroy').empty(); } }); });
The code I use for the demo videos is VERY similar.
jQuery('a.demoVid').click(function(){ var videoUrl=jQuery(this).attr('href'); jQuery('div#showNote').dialog({ modal: true, height: 400, width: 480, close: function(){ jQuery('div#showNote').dialog('destroy').empty(); } }); swfobject.embedSWF(videoUrl,'showNote','480','390','8.0.0'); return false; });
I can click on as many notes as I want, and the dialog opens up and shows the note. However, when I click the demoVid, the dialog opens, but then closing the dialog kills any other 'showNote' dialogs on the page, so I can't open any more notes, or demo video开发者_如何学运维s.
My second guess is that the call to swfobject.embedSWF is trampling on the div#showNote in some way that confuses jQuery. I'd try putting the video in a div inside the dialog, either:
jQuery('div#showNote').append('<div id="showVideo"></div>').dialog({ ... });
swfobject.embedSWF(videoUrl,'showVideo','480','390','8.0.0');
You're dialog is targetting div#showNote
, and element IDs must be unique in the document. You should change it so it creates a new div
for each dialog instance, something like the following (untested):
jQuery( $('<div class="note">') ).dialog({ ...
close: function() {
$(this).dialog('destroy').empty();
}
});
精彩评论