Jump to content

Iterate Through Element Arrays


hybrid kill3r

Recommended Posts

So I'm not really sure of how I should get started with this. I have a php loop of image thumbnails but I want to load the images through Ajax. This is what my loop bit looks like:

<span id='image[123]'></span>

What I want to do is iterate through all elements with the id of image, then get their values and load the image with ajax. Basically all I'm looking for is a tutorial on how to iterate through all of those spans. Any ideas?

Link to comment
Share on other sites

For what you're trying to do I would recommend you instead print the images to a hidden div element with php and then use javascript to loop through the elements of that hidden div.

<div class='hidden' id='imagesHolder'><img src=""><img src=""><img src=""></div>

Then with javascript-

imagesHolder = document.getElementById("imagesHolder");images = imagesHolder.childNodes;for(i = 0; i < images.length; i++){image = images[i];}

Something like that. You would only want to use ajax if the content changes often. If you use ajax it will be unnecessarily slow for your visitors when they need to make a new http request every time they want to get another image.But to answer your question. If you are set on the ajax method then you can do something like this-

<span id="imageIds" value="1,2,3"></span>

window.currentImagePosition = 0;imageIds = document.getElementById("imageIds");val = imageIds.value;numIds = val.length;window.currentImagePosition++;if(window.currentImagePosition >= numIds)   window.currentImagePosition = 0;imageId = imageIds[window.currentImagePosition];

Then send that image id using ajax to your php page that would return an image src that is related to the id.

Link to comment
Share on other sites

For what you're trying to do I would recommend you instead print the images to a hidden div element with php and then use javascript to loop through the elements of that hidden div....
<div class='hidden' id='imagesHolder'>...code...

Something like that. You would only want to use ajax if the content changes often. If you use ajax it will be unnecessarily slow for your visitors when they need to make a new http request every time they want to get another image.##CUT##

are people using AJAX as the new "block Right Click" in terms of guarding against image "theft" ?i also had a look at your EasyImage in your sig - i'm guessing this would be quite desirable for ppl trying to avoid the "right click theft" as well.one question though, if the SVG namespace becomes standard within HTML, would it make EasyImage redundant ?
Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...