Prevent image from showing twice

[Richieaxe]

I'm trying to create a flag quiz but can't figure out how to prevent the same flag showing twice. Please help.

[CODE]
<form action="#" method="POST" id="myform" name="myform">
<img class="flag" src="Flaggor/sveriges-flagga.png" alt="sweden"/>
<img class="flag" src="Flaggor/usas-flagga.png" alt="usa"/>
<img class="flag" src="Flaggor/armeniens-flagga.png" alt="armenia" />
<img class="flag" src="Flaggor/azerbajdzjans-flagga.png" alt="azerbadjan" />
<img class="flag" src="Flaggor/australiens-flagga.png" alt="australia" />
<img class="flag" src="Flaggor/angolas-flagga.png" alt="angola" />
<img class="flag" src="Flaggor/spaniens-flagga.png" alt="spain" />
<img class="flag" src="Flaggor/afghanistans-flagga.png" alt="afghanistan" />
<img class="flag" src="Flaggor/argentinas-flagga.png" alt="argentina" />
<img class="flag" src="Flaggor/bahrains-flagga.png" alt="bahrain" />
<img class="flag" src="Flaggor/brasiliens-flagga.png" alt="brazil" />
<img class="flag" src="Flaggor/cyperns-flagga.png" alt="cyprus" />
<img class="flag" src="Flaggor/frankrikes-flagga.png" alt="france" />
<img class="flag" src="Flaggor/finlands-flagga.png" alt="finland" />
<img class="flag" src="Flaggor/danmarks-flagga.png" alt="denmark" />
<img class="flag" src="Flaggor/japans-flagga.png" alt="japan" />
<img class="flag" src="Flaggor/indiens-flagga.png" alt="india" />
<img class="flag" src="Flaggor/kinas-flagga.png" alt="china" />
<img class="flag" src="Flaggor/kanadas-flagga.png" alt="canada" />
<input type="text" id="answer" name="answer">

<div id ="knapp">
<input type="button" id="send" value="Answer the Question">
</div>
<div id="new">
<input type="button" id="new_game" value="New Game" onclick="newGame()">
</div>
<div id="knapp1">
<input type="button" id="next" value="Next Question" onclick="nextFlag()">
</div>
</form>
<div id="gameOver">
<p id="total"></p>
</div>
<div class="score">
<p>Poäng:</p>
<input type="text" name="points" id="points" readonly="readonly" class="knapp"/>
</div>
<p id="result"></p>

<script>
var score = 0;

$().ready(function() {


$("#send").live("click",function() {
var answer = $("#answer");

if(answer.val() == $(".flag:visible").attr("alt")) {
score++;
$("#result").html("VERY WELL THEN!");
$("#points").val(score);
$("#result").css('color','green');
$("#knapp1").show();
$("#knapp").hide();
$("#new").hide();
$("#cheat").hide();
$("#gameOver").hide()


}else {
$("#result").html("BLAST!!");
$("#points").val(score);
$("#result").css('color','red');
$("#knapp1").hide();
$("#knapp").hide();
$("#new").show();
$(".score").hide();
$("#gameOver").show();
$("#total").html("You got: " + score + " Points");


}

});
changeFlag();
function changeFlag()
{

var antalFlags = $(".flag").size();
var slumpad = Math.floor(Math.random()*17);
$(".flag").eq(slumpad).show();

}

});
var flagArray = null;

Array.prototype.contains = function(obj) {
var i = this.length;
while (i--) {
if (this[i] === obj) {
return true;
}
}
return false;
}

function nextFlag(){
if(flagArray==null)
flagArray = new Array();
var antalFlags = $(".flag").size();
var slumpad = Math.floor(Math.random()*17);

if(flagArray.contains(slumpad))
nextFlag();

$(".flag").eq(slumpad).show();
$(".flag").hide();
$(".flag").eq(slumpad).show();
$("#result").html("");
$("#knapp1").hide();
$("#knapp").show();
$("#answer").val("");
$("#cheat").hide();
flagArray.push(slumpad);


}
function newGame(){
var antalFlags = $(".flag").size();
var slumpad = Math.floor(Math.random()*17);
$(".flag").eq(slumpad).show();
$(".flag").hide();
$(".flag").eq(slumpad).show();
$("#knapp1").hide();
$("#knapp").show();
$("#points").val(0);
$("#result").html("");
$("#new").hide();
$("#answer").val("");
$("#cheat").hide();
$(".score").show();
$("#gameOver").hide();
score = 0;


}





</script>
[CODE]

[Philip M]

Instead of selecting a flag randomly, shuffle the array of flags images and then present them in order.

<script type="text/javascript">

Array.prototype.shuffle = function() {
var s = [];
while (this.length) s.push(this.splice(Math.random() * this.length, 1));
while (s.length) this.push(s.pop());
return this;
}

var images= ["One.gif", "Two.gif", "Three.gif", "Four.gif","Five.gif","Six.gif", "Seven.gif", "Eight.gif"];
var newarray = images.shuffle();
alert (newarray);
alert (newarray[0]);

</script>

The Epistles were the wives of the Apostles.
- Pupil's answer to Catholic Elementary School test.

[Richieaxe]

Thanks Never thought about that. Great solution.