How do I change/replace a flash object with jquery or pure javascript?

Question

I want to change a flash object enclosed within with jQuery after an onClick event. The code I wrote, essentially:

$(enclosing div).html('');
$(enclosing div).html(<object>My New Object</object>);

works in Firefox but not in IE. I would appreciate pointers or suggestions on doing this. Thanks.

Answer 1

The empty() method is the better way of deleting content. Don't know if that will solve your problem though :)

$('#mydiv').empty();

You could also try the replaceWith(content) method.

Answer 2

Try the $().remove() method. This also removes event handlers to avoid memory leak problems and is one of the reasons why just setting the HTML to empty is not a good idea.

Answer 3

This is what I'm doing - it's taken from the swfobject and modified slightly:

function removeObjectInIE(el) {
    var jbo = (typeof(el) == "string" ? getElementById(el) : el);
    if (jbo) {
        for (var i in jbo) {
            if (typeof jbo[i] == "function") {
                jbo[i] = null;
            }
        }
        jbo.parentNode.removeChild(jbo);
    }
}

function removeSWF(id) {
    var obj = (typeof(id) == "string" ? getElementById(id) : id);
    if(obj){
        if (obj.nodeName == "OBJECT" || obj.nodeName == "EMBED") {
            if (ua.ie && ua.win) {
                if (obj.readyState == 4) {
                    removeObjectInIE(id);
                }
                else {
                    $(document).ready(function() { removeObjectInIE(id); });
                }
            }
            else {
                obj.parentNode.removeChild(obj);
            }
        }else if(obj.childNodes && obj.childNodes.length > 0){
            for(var i=0;i<obj.childNodes.length;i++){
                removeSWF(obj.childNodes[i]);
            }
        }
    }
}    

So you would then do removeSWF("mydiv"); - You'd probably want to rewrite this in a jQuery manner, this is taken from a library I am working on where I can't be certain jQuery will be there. (I replaced my on ready function with the $().ready())