Random questions to display a download link

The basic idea is to have several questions, but only 1 showing randomly on page load. Then whatever answer to that question, will display a download.

The questions load randomly, but when I put in the answer the download doesn't display. I thought I had all my code correct, but maybe there is a better way to do this. If you could help me out, I'd greatly appreciate it.

P.S. I already know this isn't a super secure way to hide something, but it doesn't ne开发者_如何学Pythoned to be very secure.

<form id="1">
Enter the 5th word on page 28 to access the download:
<input id="pwd1" name="pwd1" type="text" />
</form>
<form id="2">
Enter the 6th word on page 29 to access the download:
<input id="pwd2" name="pwd2" type="text" />
</form>
<form id="3">
Enter the 4th word on page 30 to access the download:
<input id="pwd3" name="pwd3" type="text" />
</form>
<form id="4">
Enter the 3rd word on page 32 to access the download:
<input id="pwd4" name="pwd4" type="text" />
</form>
<form id="5">
Enter the 5th word on page 33 to access the download:
<input id="pwd5" name="pwd5" type="text" />
</form>
<form id="6">
Enter the 3rd word on page 34 to access the download:
<input id="pwd6" name="pwd6" type="text" />
</form>
<form id="7">
Enter the 5th word on page 35 to access the download:
<input id="pwd7" name="pwd7" type="text" />
</form>
<form id="8">
Enter the 4th word on page 36 to access the download:
<input id="pwd8" name="pwd8" type="text" />
</form>
<form id="9">
Enter the 6th word on page 37 to access the download:
<input id="pwd9" name="pwd9" type="text" />
</form>


<div id="hc" style="display: none;">
<center><a href="sudoku.zip"><img id="download" src="download.png"></a></center>
</div>

<script language="javascript">
var rand = Math.floor(Math.random()*9);
$('form').hide().eq(rand).show();
$('form').keyup(function(){
if($('#pwd1').val() == 'more'){
   $('#hc').show('slow');
}
if($('#pwd2').val() == 'Rectangle'){
   $('#hc').show('slow');
}
if($('#pwd3').val() == 'case'){
   $('#hc').show('slow');
}
if($('#pwd4').val() == 'similarities'){
   $('#hc').show('slow');
}
if($('#pwd5').val() == 'similar'){
   $('#hc').show('slow');
}
if($('#pwd6').val() == 'this'){
   $('#hc').show('slow');
}
if($('#pwd7').val() == 'done'){
   $('#hc').show('slow');
}
if($('#pwd8').val() == 'outside'){
   $('#hc').show('slow');
}
if($('#pwd9').val() == 'completed'){
   $('#hc').show('slow');
}
else{$('#hc').hide();} 
});
</script>

---

your code will only work if #pwd9 is the one shown. change your if's to else if's. or switch

and NO, it no secure at all. the link is there all the time

---

This would be alot cleaner:

var rand = Math.floor(Math.random() * 9),
    words = ['more', 'Rectangle', 'case', 'similarities', 'similar', 'this', 'done', 'outside', 'completed'];
$('form').hide().eq(rand).show();
$('form input').keyup(function() {
    if (this.value === words[rand])
        $('#hc').show('slow');
});

Here is a jsFiddle of it working.

Edit I had the index on words wrong, fixed now.

---

I think that you are missing something in the syntax - all your if statements (bar the first), should be elseif's.

This really isn't very secure, and to be honest, probably more work than doing it 'properly' (i.e. display the question dynamically and only have a single form, and probably do something (almost anything) to make this more secure).

---

I'm not sure this can work at all. This is how it should be done:

1. A server-side language, like php, selects random question and prints out a form on screen.

2. Your form needs a submit button, which, when pressed, will send the data to the server.

3. Server-side language will then process the data and decide whether to show link or not.

This is how it's normally done + it's more secure, answers and link cannot be read so easily.

---

Your problem is that you're only using if's. Use else if for each if to make the final else relative to all if's rather than just the last.