3 Replies - 1130 Views - Last Post: 08 December 2011 - 03:31 PM

#1 tez.grant  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 9
  • Joined: 21-January 10

task - unable to assign specific images to questions in my array...

Posted 06 December 2011 - 07:24 AM

<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/jQuizMe.js"></script>
<script type="text/javascript">
var mcqimg = new Image();
mcqimg.src = "images1.JPG";

function image1(){
	if (document.images) {
	document["imagename"].src = mcqimg.src
	}};
</script>
</head>
<body>
<div id="header"></div>
<div id="content">
<div id="quizArea"/>
<script type="text/javascript">

$( function($){
	var quizMulti = {
    multiList:
	[	
		/* Core Questions */
		{ ques: "Question1", ans: "right answer", ansSel : [ "wrong answer1", "wrong answer2", "wrong answer3" ] },
		{ ques: "Question2", ans: "right answer", ansSel : [ "wrong answer1", "wrong answer2", "wrong answer3" ] },
		{ ques: "Question3", ans: "right answer", ansSel : [ "wrong answer1", "wrong answer2", "wrong answer3" ] },



</script>
</body>
</html>



This is not all of my code but its a good post to start with to explain my issue, the full documents involved total about 1600 lines.

the multiList array contains multiple choice questions, for each of these there is a specific picture file the user must be able to access, however i'm having some serious trouble getting the correct picture to associate with the questions, every time i try to link to a picture or use a variable or function in the question array all the javascript stops working and an error is thrown.

any pointers towards solutions would be welcome and i can supply more information if needed but due to my client am unable to supply the entire file or any of the content so it will need to be edited before posting.

many thanks in advance!
- Tez Grant

Is This A Good Question/Topic? 0
  • +

Replies To: task - unable to assign specific images to questions in my array...

#2 e_i_pi  Icon User is offline

  • = -1
  • member icon

Reputation: 789
  • View blog
  • Posts: 1,676
  • Joined: 30-January 09

Re: task - unable to assign specific images to questions in my array...

Posted 06 December 2011 - 02:09 PM

Firstly, I can see some syntax errors in your Javascript:
<script type="text/javascript">
var mcqimg = new Image();
mcqimg.src = "images1.JPG";

function image1()
{
	if (document.images) {
		document["imagename"].src = mcqimg.src;
	}
}
</script>


You don't seem to be using jQuery either, despite having it as an available script.

Also, it looks like someone has had a very similar problem on StackOverflow, so you might be able to get some good information from that article. It looks like there might be issues with caching that you have to address as well.

This post has been edited by e_i_pi: 06 December 2011 - 02:11 PM

Was This Post Helpful? 0
  • +
  • -

#3 tez.grant  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 9
  • Joined: 21-January 10

Re: task - unable to assign specific images to questions in my array...

Posted 08 December 2011 - 07:25 AM

Thank you for your help,

I'm afraid the code i've uploaded in my question is only a small part of that which i'm using but jQuery is being used a bit later on for transitions and a gallery.

The image1 function and mcqimg variable run fine, they're not the issue, this line:

{ ques: "Question1", ans: "right answer", ansSel : [ "wrong answer1", "wrong answer2", "wrong answer3" ] },



is a question which is randomly selected from a list and displayed to the user, there should be an image pertaining to the question displayed as well when a button is pressed.

I have a button and it displays a picture, that picture can also be made to change, however i find myself unable to ensure the correct picture (there are around 50 in total) is displayed with the correct question.

even if someone could explain why i am unable to use a function like:

function image1(){
	if (document.images) {
		document["imagename"].src = mcqimg.src
		}};


at the end of the question line (example below) it would be immensely helpful!

$( function($){
    var quizMulti = {
    multiList:
    [  
        /* Core Questions */
        { ques: "Question1", ans: "right answer", ansSel : [ "wrong answer1", "wrong answer2", "wrong answer3" ] },
        { ques: "Question2", ans: "right answer", ansSel : [ "wrong answer1", "wrong answer2", "wrong answer3" ] },
        { ques: "Question3", ans: "right answer", ansSel : [ "wrong answer1", "wrong answer2", "wrong answer3" ] },
]
}
}
);



P.S. I am using the jQuizMe Plugin attatched to this post!

Attached File(s)


Was This Post Helpful? 0
  • +
  • -

#4 e_i_pi  Icon User is offline

  • = -1
  • member icon

Reputation: 789
  • View blog
  • Posts: 1,676
  • Joined: 30-January 09

Re: task - unable to assign specific images to questions in my array...

Posted 08 December 2011 - 03:31 PM

Why don't you add the image path to the question-answers data object, and reference that image path when you display a new question?
$( function($){
    var quizMulti = {
    multiList:
    [  
        /* Core Questions */
        { ques: "Question1", img: "image001.jpg", ans: "right answer", ansSel : [ "wrong answer1", "wrong answer2", "wrong answer3" ] },
        { ques: "Question2", img: "image002.jpg", ans: "right answer", ansSel : [ "wrong answer1", "wrong answer2", "wrong answer3" ] },
        { ques: "Question3", img: "image003.jpg", ans: "right answer", ansSel : [ "wrong answer1", "wrong answer2", "wrong answer3" ] },
]
}
}
);


This post has been edited by e_i_pi: 08 December 2011 - 03:31 PM

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1