Wrox Programmer Forums
Go Back   Wrox Programmer Forums > Web Programming > JavaScript > Javascript How-To
| Search | Today's Posts | Mark Forums Read
Javascript How-To Ask your "How do I do this with Javascript?" questions here.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the Javascript How-To section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
 
Old March 10th, 2013, 08:31 PM
Registered User
Points: 10, Level: 1
Points: 10, Level: 1 Points: 10, Level: 1 Points: 10, Level: 1
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Mar 2013
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
Red face Using Array photos for buttons

Hello everyone, first post here. I have searched for an answer for my problem and tried many things posted but just can't figure it out. I have created two arrays. One of "photos" and the other of the "name" of the photo. I am using a function randomNum() to generate the selection from the name "name" Array and returning the Name and the index to test against. The problem that I am having is that I want the button to click on populated with each of the 7 images from the photos array. I can not figure how to do this and then display it on the page where I want instead of using document.write(), which opens up a new page.
here is my code that I have written so far;
Code:

<script type="text/javascript">

var photos= new Array(7)

photos[1]= "images/leafedge1.jpg"; 
photos[2]= "images/leafedge2.jpg";
photos[3]= "images/leafedge3.jpg";
photos[4]= "images/leafedge4.jpg";
photos[5]= "images/leafedge5.jpg";
photos[6]= "images/leafedge6.jpg";
photos[7]= "images/leafedge7.jpg";

var leafArray= new Array(7);

leafArray[1] = "Entire";
leafArray[2] = "Undulate";
leafArray[3] = "Finely Serrated";
leafArray[4] = "Coursely Serrated";
leafArray[5] = "Doubly Serrated";
leafArray[6] = "Crenate";
leafArray[7] = "Lobed";

function randomNum(){
 firstRandomNumber = (Math.round((Math.random()*6)+1))
  	ans = (leafArray[firstRandomNumber]+"</br>");
	num = (firstRandomNumber);
	return ans;
	return num;
	}

function checkAns(){
    .
    .
    .
    }

 
</script>


</head>



 <body bgcolor="#ffffdd">
<table>
<tr>
<td>
  <form name ="answers">
<img src="treeImage.jpg" alt="Tree Image" height="850" width="542">
  <input type="submit" value="Refresh"/>


<p>Click the button to trigger a function.</p>

<button src= leafEdge1.jpg onclick="randomNum()">Click for the leaf challenge</button>
<p id="leaf"></p>

  </form>

i was able to get the buttons as the images using the src tag but not using the Array. The purpose of the button is to ask the question populated by the ''name" array in the question and then display the images so that one may click on it for to check the answer. I am thinking that I need to use the array so that I can check the index of the array against the index of the image and if they match, they have a correct answer. my coding is probably terrible, but i am trying to learn. Any help at all would be much appreciated.




Similar Threads
Thread Thread Starter Forum Replies Last Post
Using Array photos for buttons rflynet Javascript How-To 0 March 10th, 2013 08:30 PM
How to add 5 more photos js32821 BOOK: ASP.NET 2.0 Instant Results ISBN: 978-0-471-74951-6 5 September 3rd, 2007 12:48 PM
Ridiculus photos shapira BOOK: Professional Crystal Reports for VS.NET 0 March 7th, 2005 08:11 PM
Uploading Photos microchip Classic ASP Basics 6 April 25th, 2004 10:15 AM
Photos in access kev_79 Access 1 July 24th, 2003 02:24 PM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.