Onclick删除/删除图像

Question

I need to load an .swf file after we click on an image

The .swf file loads successfully after we click on the image,but it loads the .swf below the image.I need to replace the img with .swf(in short,hide the img).

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>

<script type="text/javascript">

function loadSWF(url){
    swfobject.embedSWF(url, "flashcontent", "550", "400", "9");
}
document.getElementById('iii').style.display = 'none';

</script>

<p><a href="http://www.leconcombre.com/stock/coccyminimini1.swf" onclick="loadSWF(this.href); return false;">


<div id="iii" class="iii">
<img id="my_image17" border="0" src="http://4.bp.blogspot.com/-7Ij8T9BvULw/VJWltsHNmhI/AAAAAAAANDI/a76wpzm_a-E/s1600/world%2Bmap%2Bcolor_1.jpg" />
</div>

</a></p>

<div id="flashcontent"></div>

I need to hide/remove the class/id "iii" (within which the img tag lies).However the code doesn't seem to work only with respect to hiding/removing of img. Any tips?

Answer 1

Looks like ...

function loadSWF(url){
    swfobject.embedSWF(url, "flashcontent", "550", "400", "9");
    document.getElementById('iii').style.display = 'none';
}

... the hide should occur when the load does.

Answer 2

I think this is what you're looking for.

I made a js fiddle for you. http://jsfiddle.net/q7a96h14/1/

html

<div id="iii" class="iii">
  <img id="my_image17" border="0" src="http://4.bp.blogspot.com/-7Ij8T9BvULw/VJWltsHNmhI/AAAAAAAANDI/a76wpzm_a-E/s1600/world%2Bmap%2Bcolor_1.jpg" /> 
</div>

js

$(function(){
  var $img       = $("#my_image17")
    , $container = $("#iii");
  $img.on("click", function() {
    $img.remove();
    $container.html("<embed src='http://www.leconcombre.com/stock/coccyminimini1.swf' width='550'  height='400'/>");
    $container.removeClass().removeAttr("id");
  });
});