SitePoint Sponsor

User Tag List

Results 1 to 18 of 18
  1. #1
    SitePoint Member
    Join Date
    Jan 2007
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Help! frustrated Newbie to JavaScript

    I'm in the beginning stages of learning JavaScript for an application at work. I am having problem with a simple command, I think it is an issue with the server, IE or something. Can you help me please? Here is a copy of a rudamentary code that illustrates the problem.
    <HTML>
    <HEAD>
    </HEAD>

    <BODY>
    <SCRIPT Language="JavaScript">
    document.write('<IMG src="Blue hills.jpg">')
    </SCRIPT>
    </BODY>
    </HTML>

    I've tried replacing the 'blue hills.jpg' with the full extention yet still it only displays the place holder, you know the box with an X in it. ...thank you you for any advise.

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Does the file 'Blue hills.jpg' exist in the same file directory ('folder') as the HTML file?

    Using whitespace in URIs can be iffy. Try "Blue&#37;20hills.jpg".

    Also, the language attribute for the SCRIPT element is deprecated. Meanwhile, the type attribute is required. You should write your tag as
    HTML Code:
    <script language="text/javascript">
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Member
    Join Date
    Jan 2007
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you, I allready considering them being in same directory, but just incase of also tried the entire path. I also attempted the image Sunset.jpg so the space wouldn't be a concern. I also just alterned the language attribute, and instead of displaying the place holder it just have me a white screen. The Sunset image I'm using is straight from the default XP picture directory. Here is a copy of my new adjusted code that provided only a blank screen.
    <HTML>
    <HEAD>
    </HEAD>

    <BODY>
    <SCRIPT Language="text/JavaScript">
    document.write('<IMG src="C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Sunset.jpg">')
    </SCRIPT>
    </BODY>
    </HTML>

  4. #4
    SitePoint Member
    Join Date
    Jan 2007
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    After speaking to a coworking who thinks it may be the firewall here at work. Could this be the problem in this scenerio? They do have an elaborate security system here.

  5. #5
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Nimlack View Post
    I also just alterned the language attribute, and instead of displaying the place holder it just have me a white screen.

    <SCRIPT Language="text/JavaScript">
    You missed the important part: the language attribute is deprecated. It's not only the value you need to change, it's also the attribute name, which should be type:
    Code:
    <script type="text/javascript">
    Quote Originally Posted by Nimlack View Post
    After speaking to a coworking who thinks it may be the firewall here at work. Could this be the problem in this scenerio?
    It's possible, I suppose. Firewalls are sometimes configured to prevent JavaScript files from passing through, and I guess they might even strip out JavaScript code fragments from within other file types (like HTML).

    If you try this from your local hard drive, rather than going through a web server, you should at least be able to ascertain whether you've got the syntax right.
    Birnam wood is come to Dunsinane

  6. #6
    SitePoint Member
    Join Date
    Jan 2007
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you for your input ...I got excited thinking it would solve the problem.
    so I changed it to :
    <HTML>
    <HEAD>
    </HEAD>

    <BODY>
    <SCRIPT type="text/JavaScript">
    document.write('<IMG src="C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Blue hills.jpg">')
    </SCRIPT>

    Now when I run it ....well it still only displays the place holder
    square with the x in the middle... I'm thinking more strongly that it's a securtity issue. If anyone has anymore possible solurions I beseach you please inform me.

    Thank you

  7. #7
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,872
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    \ is the escape character in javascript. To include an actual \ in the filename within Javascript you need to specify it as \\ so as to unescape it.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  8. #8
    SitePoint Member
    Join Date
    Jan 2007
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thank you I tried taking out the \ characters. The image and code are in same directory so that shouldn't be an issue ...still doesn't work ...same result just the place holder.

  9. #9
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Instead of dynamically writing the <img> tag, try getting rid of all the javascript, and putting the <img> tag in the <body>. See if the image will display.

    If the image displays, then add the attribute id="myImg" to the <img> tag, and add this code in the <head>:
    Code:
    <script type="text/javascript">
    
    window.onload=function()
    {
    	var img = document.getElementById("myImg");
    	
    	document.write(img.src);
    };
    </script>
    Reload the page. The image should no longer appear; instead some text should display. Hilight and copy the path that is displayed on the page. Then use that path as the value of the src attribute for the <img> tag when you dynamically write the <img> tag using your js.

  10. #10
    SitePoint Member
    Join Date
    Jan 2007
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you and please excuse my lack of knowlege, I've just recently begun teaching myself HTML and JavaScript. Here is a copy of the code I made based on prior suggestion. It still failed to work
    <HTML>
    <HEAD>
    <SCRIPT type="text/JavaScript">
    window.onload=function()
    {
    var img = document.getElementById("myImg");

    document.write(img.src);
    };
    </SCRIPT>
    </HEAD>

    <BODY>

    <IMG id="C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Blue hills.jpg">

    </BODY>
    </HTML>
    ....Oh and the image did apear when I sourced it without javascript.

  11. #11
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    then add the attribute id="myImg" to the <img> tag
    Code:
    <IMG id="C:\Documents and Settings\All Users\Documents\My Pictures\Sample Pictures\Blue hills.jpg">

    "add" means "in addition to what you already have". Don't replace anything--add it.
    Last edited by 7stud; Feb 2, 2007 at 00:52.

  12. #12
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The value of the src attribute is a URI (uniform resource identifier). Path segments in a URI are separated by forward slashes, not the Windows-style backslash characters.

    And you still have all those blanks in your path. Try:
    HTML Code:
    <img src="file://localhost/C&#37;3A/Documents%20and%20Settings/All%20Users/Documents/My%20Pictures/Sample%20Pictures/Blue%20hills.jpg" alt="(text equivalent)">
    Birnam wood is come to Dunsinane

  13. #13
    SitePoint Member
    Join Date
    Jan 2007
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you so much for the clarification.. I don't have time to try that today and won't be back in till Monday, I will try it then thank you.

  14. #14
    SitePoint Enthusiast Tygatur's Avatar
    Join Date
    Apr 2006
    Location
    Germany
    Posts
    53
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Which tutorial do you use? Looks like it isn't very good...

    OK, some things for you to keep in Mind:

    The web ist unix-oriented. This means that paths normally are build with normal slashes ( / ) instead of backslashes ( \ ).
    Even Windows can handle normal slashes in path descriptions, so use them!
    (If you ever upload this site onto the net, nobody will be able to see your images because browsers don't like backslashes)

    Write tags and attributes in lower case letters. It reads better (and is required if you want to use XHTML...)

    There has to be a <title></title> between <head> and </head> !

    Avoid spaces in the names of the files.
    This may be the reason why
    Blue hills.jpg
    isn't found.

    Advanced advice (for you as a newbie it's OK to neglect this for a while)
    -document.write() is bad style. Use the DOM functions
    -single tags like <img> should be closed in xml style--> <img />


    try the following in a new file:
    <script type="text/javascript">
    alert('yes, JavaScript is not blocked by the firewall!');
    </script>
    A message window should appear. If not, check if your Browser has JavaScript enabled. If your Firewall seems to block JavaScript throw it away. It's just ridiculous to block JavaScript as a firewall.
    to code or not to code ?
    that's too much of a question for a signature.

  15. #15
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Tygatur View Post
    -single tags like <img> should be closed in xml style--> <img />
    No! That only applies to XHTML. It must not be used in HTML.

    In HTML, <img/> means <img>&gt; (an IMG element followed by a greater-than sign). The fact that almost all browsers get this wrong is not a valid reason for using it. It will also cause validation errors for EMPTY elements in the HEAD (like <meta> or <link>) because character data is not allowed inside HEAD.
    Birnam wood is come to Dunsinane

  16. #16
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Jeebers,

    Before you do anything else, see if this works:
    Code:
    <HTML>
    <BODY>
    <IMG src="Blue&#37;20hills.jpg">
    </BODY>
    </HTML>

  17. #17
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Before you do anything else, see if this works:
    Already been covered. Reread thread.

  18. #18
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    7,

    I know you already suggested that but I don't see anywhere that it was tested. The closest was <img id="filename"> and that wont work.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •