clay
clay

Reputation: 33

Attempting to get a javascript variable to be an image source

<div id="companyLogo"></div>
<script type = "text/javascript">
    var imageName = prompt("Client Logo Image:");
    $('#companyLogo').html(<img src = imageName, style="-webkit-filter: invert(100%);">);
</script> 

I am trying to get imageName to be the source for the "img src" tag. Any help is greatly appreciated. Thanks!

Upvotes: 2

Views: 53

Answers (2)

Robin
Robin

Reputation: 471

try this.

in the begining :

<div id="companyLogo">
  <img src="" id="#companyImg" style="display:none;" />
</div>

On some event the prompt box is displayed to the user

<script>
  $(document).ready(function(){
      var imageName = prompt("Client Logo Image:");
      $("#companyImg").attr('src', 'your image path' + imageName);
      $("#companyImg").css('display','block');
  });
</script>

Upvotes: 1

Mike
Mike

Reputation: 1316

It's a better practice to keep your javascript away from your html. So you could create an html document like so:

<!DOCTYPE html>
<html>
 <body>
    <img id="companyLogo" src="path/to/some/default.img" alt="Your Company Logo" />

 <script>
    //prompts user for input
    var imgSrc = prompt("Please input name");

    //changes src of the targeted image to the value input by the user
    document.getElementById("companyLogo").src = imgSrc;
 </script>
 </body>
</html>

Here is a fiddle

Upvotes: 1

Related Questions