variable as array index

[Jammer]

I want to do something like:
var img_index="dog";
document.images[img_index] = "blah";

images[img_index] is treated like images["img_index"]

I want to use the value of img_index in the images array.

 

[Craig Taylor]

I want to do something like:
var img_index="dog";
document.images[img_index] = "blah";

images[img_index] is treated like images["img_index"]

I want to use the value of img_index in the images array.

Using FF I was unable to duplicate your issue but you may want to try
forcing an expression evaluation by enclosing the index in ()'s; ie:

document.images[(img_index)]

- Craig Taylor
http://www.ctalkobt.net

 

[Randy Webb]

Craig Taylor said the following on 2/24/2007 11:34 PM:

I want to do something like:
var img_index="dog";
document.images[img_index] = "blah";

images[img_index] is treated like images["img_index"]

I want to use the value of img_index in the images array.

Using FF I was unable to duplicate your issue but you may want to try
forcing an expression evaluation by enclosing the index in ()'s; ie:

document.images[(img_index)]

What exactly do you think that accomplishes by wrapping it in ()?
Part of the issue is going to be trying to set
document.images[var]="blah" as document.images[var] is going to be
referencing an object and then you are trying to set that object equal
to something else. Setting a property of the image is a different
scenario though.

 

[Jammer]

I want to do something like:
var img_index="dog";
c

images[img_index] is treated like images["img_index"]

I want to use the value of img_index in the images array.

I want to:

document.images[img_index] = "blah";
where img_index = "dog";


so effectively. I want:
document.images["dog"] = "blah";

but then I want:
img_index="cat";
document.images[img_index] = "blah2";

Here is the code I tried:

function openNav( button_name ) {
var img_path = "/images/nav/" + button_name + ".png";
document.images[(button_name)].src = img_path;
}

I want to call:
openNav( "dog" );
openNav( "cat" );

 

[Lee]

Jammer said:

I want to do something like:
var img_index="dog";
c

images[img_index] is treated like images["img_index"]

I want to use the value of img_index in the images array.

I want to:

document.images[img_index] = "blah";
where img_index = "dog";


so effectively. I want:
document.images["dog"] = "blah";

but then I want:
img_index="cat";
document.images[img_index] = "blah2";

Here is the code I tried:

function openNav( button_name ) {
var img_path = "/images/nav/" + button_name + ".png";
document.images[(button_name)].src = img_path;

The document.images[] array can only be indexed by numbers.
document.images["dog"] simply assigns a new attribute to the
images object (in browsers where it's legal to do that).

You can do:

img_index=2;
document.images[img_index].src=img_path;
if there are at least three images in the page.


--

 

[Randy Webb]

Lee said the following on 2/25/2007 12:21 AM:

Jammer said:

I want to do something like:
var img_index="dog";
c

images[img_index] is treated like images["img_index"]

I want to use the value of img_index in the images array.

I want to:

document.images[img_index] = "blah";
where img_index = "dog";


so effectively. I want:
document.images["dog"] = "blah";

but then I want:
img_index="cat";
document.images[img_index] = "blah2";

Here is the code I tried:

function openNav( button_name ) {
var img_path = "/images/nav/" + button_name + ".png";
document.images[(button_name)].src = img_path;

The document.images[] array can only be indexed by numbers.

Say again? I have never seen anywhere where the document.images array is
numeric index only. In fact, document.images['imageNAME'] is the most
cross-browser way to access an image object.

document.images["dog"] simply assigns a new attribute to the
images object (in browsers where it's legal to do that).

In what browser does this fail:

<img name="image1" src="myImage1.jpg">
<img name="image2" src="myImage2.jpg">
<img name="image3" src="myImage3.jpg">
<select onchange="alert(document.images[this.value].src)">
<option value="image1">image1
<option value="image2">image2
<option value="image3">image3
</select>

You can do the reverse as well:

<img name="image1" src="myImage1.jpg">
<img name="image2" src="myImage2.jpg">
<img name="image3" src="myImage3.jpg">
<select onchange="document.images[this.value].src='someThingElse')">
<option value="image1">image1
<option value="image2">image2
<option value="image3">image3
</select>

 

[Lee]

Randy Webb said:

The document.images[] array can only be indexed by numbers.

Say again? I have never seen anywhere where the document.images array is
numeric index only. In fact, document.images['imageNAME'] is the most
cross-browser way to access an image object.

I had read the request as to create meaningful entries in the array with
arbitrary string values, and worded my response badly.


--

 

[Randy Webb]

-Lost said the following on 2/25/2007 1:50 AM:

Lee said the following on 2/25/2007 12:21 AM:

<select onchange="document.images[this.value].src='someThingElse')">

Minus that last parenthesis, from your alert example. : )

Yes indeed

 

[Jammer]

function openNav( button_name ) {
var img_path = "/images/nav/" + button_name + ".png";
document.images[(button_name)].src = img_path;

<img name="image3" src="myImage3.jpg">
<select onchange="alert(document.images[this.value].src)">

Wouldn't it make more sense to be this.name instead of this.value?


I don't what I did but it works now.


function openNav( button_name ) {
// alert( "button_name='" + button_name + "'" );
var img_path = "/images/nav/" + button_name + "_open.png";
document.images[button_name].src = img_path;
}

<a href="\" onMouseOver="openNav('home');"><img
src="/images/nav/home.png" alt="home button" name="home" border=0></a>



I would like to use the name of the image inside the href instead of
hardcoding 'home'.
I tried giving a name='home' to the href and using openNav(this.value)
but that was undefined.

 

[-Lost]

function openNav( button_name ) {
var img_path = "/images/nav/" + button_name + ".png";
document.images[(button_name)].src = img_path;

<img name="image3" src="myImage3.jpg">
<select onchange="alert(document.images[this.value].src)">

Wouldn't it make more sense to be this.name instead of this.value?

No, because it is referencing the OPTION's VALUE attribute (not the IMG's NAME attribute).

-Lost

 

[Randy Webb]

Jammer said the following on 2/25/2007 4:47 PM:

function openNav( button_name ) {
var img_path = "/images/nav/" + button_name + ".png";
document.images[(button_name)].src = img_path;

<img name="image3" src="myImage3.jpg">
<select onchange="alert(document.images[this.value].src)">

Wouldn't it make more sense to be this.name instead of this.value?

No. In the onchange of the select this.value refers to the value of the
selected option. If you change it to this.name then this.name refers to
the name attribute of the select itself - which it doesn't have.

I don't what I did but it works now.


function openNav( button_name ) {
// alert( "button_name='" + button_name + "'" );
var img_path = "/images/nav/" + button_name + "_open.png";
document.images[button_name].src = img_path;
}

<a href="\" onMouseOver="openNav('home');"><img
src="/images/nav/home.png" alt="home button" name="home" border=0></a>



I would like to use the name of the image inside the href instead of
hardcoding 'home'.
I tried giving a name='home' to the href and using openNav(this.value)
but that was undefined.

<a href="\">
<img src="/images/nav/home.png"
onmouseover="openNav(this.name)"
alt="home button"
name="home"
<border="0">
</a>

function openNav(imageName){
currentSource=document.images[imageName].src
newSource=currentSource.substring(0,currentSource.length-4)+"_open.png"
document.images[imageName].src=newSource
}