Accessing image src in internet explorer

Discussion in 'Javascript' started by faraz_mit, Dec 28, 2007.

  1. faraz_mit

    faraz_mit Guest

    Hi,
    This might be an easy question or I am missing something but I can't
    access the src property of an image tag in IE but I can access the
    width property. Is my syntax wrong for accessing the src property. I
    also tried getelementById and no luck

    I have the following simple javascript function in the head section:

    function changeimgsrc(img_src){
    alert(document.all.im.src); //DOESN'T work and shows
    undefined in IE
    alert(document.all.im.width]); // WORKS and shows 360
    }

    I have the following nested divs in my body:

    <div id="horizontal_container" >
    <h3 class="horizontal_accordion_toggle">...</h3>
    <div class="horizontal_accordion_content">
    <div id="mt" ><img id="im" name="im1" width="360" src="images/
    com_01_angle.gif" /></div>
    ....
    <div ><a href="#"
    onclick="changeimgsrc('cum_01_angel_blue.gif');">test</a> </div>
    ......
    Thanks for your help in advanced.
    Ross
     
    faraz_mit, Dec 28, 2007
    #1
    1. Advertising

  2. faraz_mit said:
    > Hi,
    > This might be an easy question or I am missing something but I can't
    > access the src property of an image tag in IE but I can access the
    > width property. Is my syntax wrong for accessing the src property. I
    > also tried getelementById and no luck
    >
    > I have the following simple javascript function in the head section:
    >
    > function changeimgsrc(img_src){
    > alert(document.all.im.src); //DOESN'T work and shows
    > undefined in IE
    > alert(document.all.im.width]); // WORKS and shows 360
    > }
    >

    Wow, I haven't seen document.all in years. Don't ever, ever, ever, ever,
    use it again.

    You have document.images['im'], document.getElementById('im'),
    document['images']['im'], or any other of ten ways to get at the image
    that will work in more than just one non-compliant browser.

    > I have the following nested divs in my body:
    >
    > <div id="horizontal_container" >
    > <h3 class="horizontal_accordion_toggle">...</h3>
    > <div class="horizontal_accordion_content">
    > <div id="mt" ><img id="im" name="im1" width="360" src="images/
    > com_01_angle.gif" /></div>
    > ....
    > <div ><a href="#"
    > onclick="changeimgsrc('cum_01_angel_blue.gif');">test</a> </div>


    Instead of # in the href, put a link to a page that will let people know
    they have to have javascript installed. Then use this tag:

    <a href="my_no_js_page.html"
    onclick="changeImgSrc('cum_01...gif');return false;">test</a>

    That way people without javascript won't just get an error, or a page
    refresh that means nothing to them.

    Download FireFox, and Safari for Windows, and test what you write in all
    of them. You'll be glad you did when you post code here.

    --
    Anthony Levensalor


    Only two things are infinite, the universe and human stupidity,
    and I'm not sure about the former. - Albert Einstein
     
    My Pet Programmer, Dec 28, 2007
    #2
    1. Advertising

  3. Randy Webb said:
    >> <a href="my_no_js_page.html"
    >> onclick="changeImgSrc('cum_01...gif');return false;">test</a>

    >
    > That I disagree with. The only purpose for the link is a JS effect, let
    > JS create the link.
    >

    Well, shouldn't he/she/they/the bunch of em at least cancel the href
    with return false in the onclick so that the page doesn't refresh for
    them if they don't have it enabled?


    --
    Anthony Levensalor


    Only two things are infinite, the universe and human stupidity,
    and I'm not sure about the former. - Albert Einstein
     
    My Pet Programmer, Dec 28, 2007
    #3
  4. My Pet Programmer said:
    > Randy Webb said:


    >> That I disagree with. The only purpose for the link is a JS effect,
    >> let JS create the link.
    >>

    > Well, shouldn't he/she/they/the bunch of em at least cancel the href
    > with return false in the onclick so that the page doesn't refresh for
    > them if they don't have it enabled?
    >
    >

    Ok, so I just realized how friggin' ridiculous THAT comment was. How are
    they supposed to cancel the href with return false if JS is disabled?
    God, I'm an idiot sometimes. Ignore me, it's what the wife does.

    ~A!

    --
    Anthony Levensalor


    Only two things are infinite, the universe and human stupidity,
    and I'm not sure about the former. - Albert Einstein
     
    My Pet Programmer, Dec 28, 2007
    #4
  5. faraz_mit wrote:
    > This might be an easy question or I am missing something but I can't
    > access the src property of an image tag in IE but I can access the
    > width property. Is my syntax wrong for accessing the src property. I
    > also tried getelementById and no luck
    >
    > I have the following simple javascript function in the head section:
    >
    > function changeimgsrc(img_src){
    > alert(document.all.im.src); //DOESN'T work and shows
    > undefined in IE
    > alert(document.all.im.width]); // WORKS and shows 360
    > }


    If that is so (and not only the result of an oversight on your part), then a
    possible explanation would be that MSHTML is confused about how to refer to
    the `img' element, since you have given it a name *and* an ID that differs
    from the name. Unfortunately, that would apply to access with
    document.getElementById() as well there; since the issue is commonplace, I
    have recently created a test case for it:

    http://pointedears.de/scripts/test/dom/names-and-ids.php

    (IE's behavior is annoying, isn't it?)

    That said, don't use document.all at all.

    > [...]I have the following nested divs in my body:
    >
    > <div id="horizontal_container" >
    > <h3 class="horizontal_accordion_toggle">...</h3>
    > <div class="horizontal_accordion_content">
    > <div id="mt" >


    If would appear you have a serious case of divitis[tm]. Try to minimize the
    number of `div' elements.

    > <img id="im" name="im1" width="360" src="images/
    > com_01_angle.gif" />

    ^
    See above. Also, avoid serving XHTML to IE; it does not support it.


    PointedEars
    --
    var bugRiddenCrashPronePieceOfJunk = (
    navigator.userAgent.indexOf('MSIE 5') != -1
    && navigator.userAgent.indexOf('Mac') != -1
    ) // Plone, register_function.js:16
     
    Thomas 'PointedEars' Lahn, Dec 28, 2007
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. cmay
    Replies:
    0
    Views:
    1,182
  2. Steve Richter

    <txt src= ...> equivalent of <img src= ...>

    Steve Richter, Feb 8, 2006, in forum: ASP .Net
    Replies:
    3
    Views:
    2,192
    Laurent Bugnion
    Feb 9, 2006
  3. Ed Hauptman
    Replies:
    7
    Views:
    1,100
    Ed Hauptman
    Aug 7, 2009
  4. John Smith
    Replies:
    1
    Views:
    174
    Evertjan.
    Mar 12, 2005
  5. Archimedes Trajano

    Changing IFrame Src Leak in Internet Explorer

    Archimedes Trajano, Dec 9, 2008, in forum: Javascript
    Replies:
    1
    Views:
    681
    Henry
    Dec 10, 2008
Loading...

Share This Page