I'm a novice javascripter at best and I'm having a problem that I usually don't have. These problems are usually due to my lack of experience and a simple omission of something.

JS:

var keith = document.getElementById("keith");
var deborah = document.getElementById("deborah");
var chris = document.getElementById("chris");

keith.onclick = new function() {
    var iframe = frames['bios'];
    
    iframe.location.href = "http://www.google.com";
}

HTML:

<ul class="about">
            <li><a href="#" id="keith">Keith Gilleard</a></li>
            <li><a href="#" id="deborah">Deborah Gilleard</a></li>
            <li><a href="#" id="chris">Chris Watson</a></li>
        </ul>
        <hr />
        
        <iframe id="bios" name="bios" src="bios.html"></iframe>

Simple, right? Not when you're me.

I'm getting keith has no properties on JS line 5.

As you can see, I'm simply trying to change the frame's source on click.

UPDATE
I just realized that i probaby need to have it say = new function. I added it and that worked out for me. More to come in a moment.

SO
Now I'm getting iframe has no properties on line 7. I realize this is due to the way I've referenced my iframe. I just finished reading something somewhere that said I could reference iframes in that way, and it was better to do so instead of using document.getELementById, but it apparently isn't working.

ACTUALLY
Converting it to referencing by ID still produces the same results (iframe has no properties).

And is your script defined before or after the iframe?

It's in the head: <script type="text/javascript" src="scripts/about.js"></script>

I would like to add that this function is triggering on load and not on the click of "keith".

onload of which element?

just as a BTW;

why have the anchor elements at all? they are not necessary, just set the function direct onto the <li>

That is a good point and I'll change it right now.

Well what i meant by the function is triggering on load is that i threw an alert with a string in it into the function and that alert triggers when the page loads.

bummmmp still need some help

Sure, but on what element is the onload event used?

every element on the age can carry and trigger an onload event, if it is triggering before the iframe is created it will not have a reference in the DOM to attach to.

Nothing is set to trigger onload. If you look at the javascript I only have an onclick set for the variable keith. This funciton triggers on the page load, not on the click of the "keith" element.

Ok, so you are not initialising the code other than allowing it to run as the script loads .
In that case the js script needs to be referenced in the source code AFTER the </ul> has been defined in the source, otherwise the <li>s will not exist in the DOM when the script tries to instantiate the variables "keith", "deborah" & "chris"

Also depending on which browser you are testing in, changing var iframe = frames['bios'] to

 
var iframe;
if (document.frames) {
	iframe = document.frames["bios"];
} else {
	iframe = window.frames["bios"];
}

should work cross browser.

Aha!! Thank you!! You had it right, the problem was the script loading beforehand. I guess I figured it would call upon it regardless.

What is the best way create functions then without having the event handler inside the actual html element and still be able to have the script in the head?

define all your methods and properties in your external file BUT wrap them in a function, call it init() or something like that.

then add a script line of <script type="text/javascript">init()</script> in between the </body> & </html> tags. This ensures that the page elements are loaded before trying to instantiate the objects and variables.
I often reference my external scripts there as well, because if you are loading a lot of JS objects it can slow down the page rendering so having the script initialise at the very end of the page it means the the content is already displayed and the visitor isn't waiting for something to happen while the js loads up. This is more important for remote scripts which may have to wait for another server (Google Analytics, Statcounter and the like)

My, oh my...

I'm getting yet another undefined. Working with a separate iframe. I have everything wrapped in a function "init()" in my external and I'm calling init between </body> and </html>.

The onclick triggers as it should. But then I'm getting "iframe is undefined" on this line:

iframe.location.href = "t1.html";

Here's the whole onclick function:

autousa.onclick = function() {
        var iframe;
        if (document.frames) {
            iframe = document.frames["testimonialsIframe"];
        } else {
            iframe = window.frames["testimonialsIframe"];
        }
        iframe.location.href = "t1.html";
            
    }

I don't see how I run into these things. If there's a problem to be had, I have it, it seems.

A new problem arises. See above.

Some day I will get it.

can we get a url so we can see ALL the code.

Sure, here ya go :
http://www.gm-research.com/tim/newGMR/tAutoUsa.php

name"testimonialsIframe"
____^ no =

Oh, wow...

Okay well.. that was dumb. Now I have a real question!!

If you change that link to /testimonials.php, you will see a sort of landing page. I want to be able to click any one of those and load a certain page with a certain source in the iframe without having to make 30 pages each with a different starting source of the iframe. What would be the best way to do this?

Let me know if I need to clarify better.

I'll have a look later on.
Just trying make IE understand that I want to reuse a xmlHTTPRequest object rather than waste memory creating a new every time!!!

ajax is beyond me. come at me with some css questions!!

although this may help:
http://keelypavan.blogspot.com/2006/...ect-in-ie.html