Results 1 to 3 of 3

Thread: Detect IFRAME Source

  1. #1
    Join Date
    Jun 2005
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Detect IFRAME Source

    Hi Guys

    Need your help with a script pls:

    Basically I have an html with 3 links (ie. 1.htm ,2.htm &3.htm) that are targeting an embedded IFRAME.

    When the user clicks on 2 for example, 2.htm will appear in the Iframe. What I need is for a script to detect (in Realtime without refreshing the page) which file is within the src of the Iframe and then call the appropriate function [ie. if iframe.src = 2.htm then function 2(); will be called or if its 1.htm then function 1() will be called]

    I've tried the .watch command but without success.

    Your help will be much appreciated!

    Kermit

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    I'd never heard of the .watch command or method but, lo and behold, it exists. It's support seems limited (read non-existent) in IE and its usefulness restricted to script created properties (not attributes, like src) of objects in FF but, I am open to learning more about it and being proved wrong on this. Be that as it may, your goal seems not to require .watch. The most straightforward method would be to have onclick events for your links which activate the functions in question when each in turn is clicked. This will miss src changes accomplished via the use of the back and forward buttons though. To make matters a bit more complex, an iframe's src attribute doesn't change when a link is clicked that targets the iframe with a new page. You have to use script to change the src. A link will change the location.href though, as will the back and forward buttons, as will actually changing its src via script. So it is the location.href we should test for and this requires that the iframe be accessed via its name:

    Code:
    <iframe name="fred" src="1.htm" frameborder="0"></iframe>
    <script type="text/javascript">
    var flag=0
    function watchFrame(){
    if (flag!==1&&fred.location.href.indexOf('1.htm')!==-1){
    flag=1
    function1();
    }
    else if (flag!==2&&fred.location.href.indexOf('2.htm')!==-1){
    flag=2
    function2();
    }
    else if (flag!==3&&fred.location.href.indexOf('3.htm')!==-1){
    flag=3
    function3();
    }
    }
    setInterval("watchFrame();", 400)
    </script>
    Notes: This assumes that there will never be a page like '11.htm' loaded into the iframe, as the test for '1.htm' will see that as a 'yes'. In fact this setup assumes that things will be as described in your post, with only '1.htm' '2.htm' and '3.htm' ever loaded into the iframe. Other pages with similar names could throw things off. The use of the flag is to assure that the spawned function fires only once per page change.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Jun 2005
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    It works

    Thanks Jon!

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
  •