JQuery Change An Embeds Src Attribute

Question

I am having trouble changing my <embed> src attribute.

(JQuery)

for (index in Forcast) {
var imageurl = "http://localhost/DesktopVersion/Inc/Images/Weather/";
var imagename = Forcast[0]['icon']+".svg)";
var WeatherIcon = imageurl+imagename;
var parent = $('embed#GetWeatherIcon').parent();
var newImage = "<embed scr=" + WeatherIcon + " />";
var newElement = $(newImage);

$('embed#GetWeatherIcon').remove();
parent.append(newElement);
....

(HTML)

<div>
<embed id="GetWeatherIcon" type="image/svg+xml" />
</div>

(CSS)

#GetWeatherIcon {
height:150px; width:150px; margin:30px 0 0 35px; padding:0; border:0; position:absolute;
}

If someone could please point out what i need to change that would be great. Thanks a bunch!

Community · Accepted Answer · 2017-05-23 11:58:33Z

3

newElement variable is missing there.

You should change

var newImage = "<embed scr="Image" />";

to

var newImage = "<embed scr=" + Image + " />";
var newElement = $(newImage);

and then should work

$('embed#GetWeatherIcon').remove();
parent.append(newElement);

Changing of src attribute is not working by this question

$('embed#GetWeatherIcon').attr('src', Image); // NOT WORKING

UPDATE:

I try your latest code and I find a problem. You made a mistake in src attribute name, you wrote scr and than it could not work. You also have an mistake in var imagename = Forcast[0]['icon']+".svg)";, there is probably wrong closing bracket.

Here is my working code:

<!DOCTYPE HTML>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF8">
  <meta name="generator" content="HTML hackers, wwww.htmlhackers.com">
  <title>Embed object change</title>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  <style>
    #GetWeatherIcon { 
      height:150px; width:150px; margin:30px 0 0 35px; padding:0; border:0; position:absolute;
    }
  </style>
</head>
<body>
  <script>
    $(document).ready(function() {
      $('#change_btn').click(function() {
        var imageurl = "http://upload.wikimedia.org/wikipedia/commons/e/e8/";
        var imagename = "Svg_example3.svg";
        var WeatherIcon = imageurl+imagename;
        var parent = $('embed#GetWeatherIcon').parent();
        var newImage = "<embed id=\"GetWeatherIcon\" src=\"" + WeatherIcon + "\" type=\"image/svg+xml\"/>";
        var newElement = $(newImage);

        $('embed#GetWeatherIcon').remove();
        parent.append(newElement);
      });
    });
  </script>
  <p id="change_btn">Change</p>
  <div>
    <embed id="GetWeatherIcon" src="http://upload.wikimedia.org/wikipedia/commons/c/c9/Svg_example4.svg" type="image/svg+xml" />
  </div>
</body>
</html>

edited May 23, 2017 at 11:58

CommunityBot

11 silver badge

answered Mar 9, 2013 at 12:48

Boris Šuška

1,8041 gold badge21 silver badges33 bronze badges

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

5 Comments

ChristopherStrydom Over a year ago

thank you for the answer :) But neither way seemed to work? The image still doesn't show up :/

ChristopherStrydom Over a year ago

i have updated the question to show my new code which is what you suggested. I don't know if i have done anything wrong but its not working. Could you please check it?

ChristopherStrydom Over a year ago

Thanks a lot for the update and sorry for the late reply. I have changed everything but i don't know what you mean when you say "...mistake in var imagename = Forcast[0]['icon']+".svg)";, there is probably wrong closing bracket". You did not add this in your code so i could not workout what i have done wrong...

Boris Šuška Over a year ago

What is evaluation of Forcast[0]['icon']+".svg)"? I gues that it is something like "http://www.somepage.com/img/icons/forecast.svg)" then bracket at end of string is wrong, because when you type this into browser you get 404 - Page not found error. Then try "http://www.somepage.com/img/icons/forecast.svg" and this may work.

ChristopherStrydom Over a year ago

Oh man I'm sorry for wasting your time :/ for some reason i thought i needed the bracket to close/encapsulate the call/command what ever it is. I then looked at it now and realized that i didn't even have an opening bracket to go with it :/ I'm such a Muppet. Thank you so much for your patience and help, its all working now!

Amrendra · Accepted Answer · 2013-03-09 12:51:07Z

0

I am not sure,bt remove src from html and give other name in source path :

var newImage = "<embed scr="new source" />";

answered Mar 9, 2013 at 12:51

Amrendra

2,0872 gold badges19 silver badges38 bronze badges

5 Comments

ChristopherStrydom Over a year ago

Hi, thanks for the answer.. could you please elaborate on what you mean by "give other name in source path" ... What is "new source"

Amrendra Over a year ago

change Image to any other name or path.

ChristopherStrydom Over a year ago

so i can write it like this...var newImage = "<embed scr="new WeatherIcon" />"; where WeatherIcon = var WeatherIcon = imageurl+imagename; ? If i do then my other functions don't work which means its incorrect??

Amrendra Over a year ago

no..no..no just image1,image2 like this or folder path like /a/b/img.gif

ChristopherStrydom Over a year ago

that wont work for what i want to do :/ I'm getting a jsonp file from a Weather API and then i take the weather state value and and assign an image for it. i cant have fixed links to images

Collectives™ on Stack Overflow

JQuery Change An Embeds Src Attribute

2 Answers 2

5 Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related