How to change the value of embed src with JavaScript?

Question

I have just begun to learn JS. I am trying to change the value of embed src in the tag present in my HTML code. But am unable to do so with the following code I've written -

HTML -

<ol>
<li><a href="http://embedgames.ru/wp-content/games/kitty-throw.swf" 
    onclick="showGame(this);return false;">Kitty Throw</a></li>
</ol>

<embed id="gameHolder" src="http://pictat.com/i/2011/7/10/32479playscrnba.jpg" 
    quality="high" menu ="false" width="550" height="400" 
    type="application/x-shockwave-flash" 
    pluginspage="http://www.macromedia.com/go/getflashplayer" /></center>

JS:

function showGame(whichgame){var source=whichgame.getAttribute("href");
var game=document.getElementById("gameHolder");
game.setAttribute("src",source);}

I want the JS to display the flash file selected in the gameHolder space which by default holds an image. I am unable to do this with just my beginner knowledge of JS, also please explain the code as you use it.

Can you include some more context, such as relevant HTML or how you actually call this function. Further, have you considered a scripting library such as JQuery or Prototype? — hayesgm
– hayesgm, Commented Jul 11, 2011 at 6:20
Your code seems to be working find. In which part do you have problem? — Saeed Neamati
– Saeed Neamati, Commented Jul 11, 2011 at 6:24

Dr.Molle · Accepted Answer · 2011-07-11 07:04:55Z

18

It may depend on the browser and the type of the embedded object, how you have to change the object(for example there are special methods for flash-movies like Play() , but the object isn't a flash-movie at the begin)

A common way is to replace the whole embed-node with a new <embed>:

function showGame(whichgame){
  var source=whichgame.getAttribute("href");
  var game=document.getElementById("gameHolder");
  var clone=game.cloneNode(true);
  clone.setAttribute('src',source);
  game.parentNode.replaceChild(clone,game)
}

answered Jul 11, 2011 at 7:04

Dr.Molle

117k16 gold badges200 silver badges206 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

user837598 Over a year ago

Thank you SOO much. It worked perfectly. BTW would you mind explaining the cloneNode function...

Dr.Molle Over a year ago

cloneNode() creates a copy of a node, that's all. The node inside the DOM will be replaced (using replaceChild() )by this copy(after the src-attribute of the copy has been changed). developer.mozilla.org/En/DOM/Node.cloneNode

rvighne Over a year ago

So, I take it changing the src attribute of an embed has no effect?

Spin0us Over a year ago

This subject is quite old but still relevant. I've just faced this problem under chrome (while changing the src under firefox works perfectly). The cloning method works very well. Thanks.

Александр Бурундук · Accepted Answer · 2017-02-08 18:25:19Z

0

It works also if you change param src only

<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">
	<EMBED id="movie" src="first.swf" "></EMBED>
</OBJECT>
<ul>
	<li name='moviename'>first.swf</li>
	<li name='moviename'>second.swf</li>
	<li name='moviename'>third.swf</li>
</ul>
<script type="text/javascript">
	var names=document.getElementsByName("moviename");
	for (var i = names.length - 1; i >= 0; i--) {
		names[i].addEventListener("click", myFunction);
		function myFunction() {
    		document.getElementById("movie").setAttribute("src", this.innerHTML);
		}
	}
</script>

answered Feb 8, 2017 at 18:25

Александр Бурундук

11 bronze badge

Comments

rrk · Accepted Answer · 2016-04-27 13:22:24Z

-1

you can set src of embed tag in javascript, for that you must have to write your embed tag in javascript like below example :

function onclickofSomething() {
    $('#IDOfParentElement').html("<embed type='application/x-mplayer2' pluginspage='http:///www.microsoft.com/Windows/MediaPlayer/' src='" + "<%=YourVideoPath%>" + "YourVideoName" + ID + ".mp4/wmv" + "' autostart='1' showstatusbar='1' enabled='1' showdisplay='1' showcontrols='1' width='630' height='380'></embed>");
}

you can also see below url : need to set video file name using javascript http://www.webdeveloper.com/forum/showthread.php?53086-how-to-change-the-src-in-lt-embed-gt-using-javascript http://www.daniweb.com/web-development/javascript-dhtml-ajax/threads/16626/how-to-change-the-the-value-of-src-in-embed-using-javascript

edited Apr 27, 2016 at 13:22

rrk

15.9k4 gold badges32 silver badges49 bronze badges

answered May 20, 2014 at 9:43

Kashyap Vyas

1291 silver badge13 bronze badges

Collectives™ on Stack Overflow

How to change the value of embed src with JavaScript?

3 Answers 3

4 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related