I have this html code test.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="jquery.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
$(document).ready(function() {
var course_data;
$.get('exerc.xml', function(data) {
course_data = data;
var that = $('#courses');
$('course', course_data).each(function() {
$('<option>').text($(this).attr('title')).appendTo(that);
});
}, 'xml');
$('#courses').change(function() {
var val = $(this).val();
var that = $('#times').empty();
$('course', course_data).filter(function() {
return val == $(this).attr('title');
})
.find("lesson").each(function() {
$("#lesson").val($(this).text());
});
});
});
</script>
<script type="text/javascript">
function keyPressed(event, input) {
if (event.keyCode == 8) {
// Allow backspace
return true;
}
// Detect character code: event.which on Firefox, event.keyCode on IE
var char = event.which ? event.which : event.keyCode;
// Convert to string
char = String.fromCharCode(char);
var exerc = new Array();
exerc = "1234 1234 1234";
// Compare to character in match string and return result
return (exerc.charAt(input.value.length) == char);
}
</script>
</head>
<body>
<form method="post" action="">
<input type="text" size="90" id="lesson" />
</form>
<form id="form2" name="form2" method="post" action="">
<input size="90" type="text" class="textarea" onkeypress="return keyPressed(event, this);" />
</form>
<form name="form1">
<p>exercices
<select style="width:100px" id='courses'>
<option selected="selected">choose...</option>
</select>
</form>
</body>
</html>
And this is my xml file exerc.xml:
<?xml version="1.0" encoding="utf-8"?>
<courses>
<course title="exercise 1">
<lesson>1234 1234 1234</lesson>
</course>
<course title="exercise 2">
<lesson>5678 5678 5678</lesson>
</course>
<course title="exercise 3">
<lesson>9012 9012 9012</lesson>
</course>
</courses>
Well, there are two inputs fields above in the first code. In the first input enter the data from the xml file (parser method). This is depend on the choice from dropdown menu. In the second input i use a function (keyPressed) which allow me to enter the same data that depict in the first input, but in order one by one. This is work very well with the first exercise. The problem is that i want to work with more exercises. I add an array with more exercises like this:
var exerc = new Array();
exerc[0]= "1234 1234 1234";
exerc[1] = "5678 5678 5678";
exerc[2] = "9012 9012 9012";
I change the first function keyPressed, but it is doesn’t work. Beybe it is totally wrong:
function keyPressed(event, input) {
if (event.keyCode == 8) {
return true;
}
var char = event.which ? event.which : event.keyCode;
char = String.fromCharCode(char);
var exerc = new Array();
exerc[0]= "1234 1234 1234";
exerc[1] = "5678 5678 5678";
exerc[2] = "9012 9012 9012";
for (i=0;i<exerc.length;i++){
document.getElementById("courses").selectedIndex;
}
return (exers.charAt(input.value.length) == char);
}
I use this exercise like a game. I can add or removes exercises from xml file and I learn the provision of keys. Maybe it is stupid for many people here, but i found it interesting. So, i stack here. Any suggestion how to fix it? Thanks in advance.
this is the solution, if someone have the same problem!