Я пытаюсь создать окно эмуляции MS-Dos с помощью jquery и ajax. Он работает хорошо, но когда я набираю слово или нажимаю клавишу ввода, сценарий отображается на один символ слишком поздно (при первом нажатии символ не отображается, затем для каждого следующего нажатия клавиши он показывает предыдущий символ, введенный пользователем, вместо текущего). ).
Вот упрощенная версия моего скрипта:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/terminal.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
//set cursor position
$('#cursor').css('left','0px');
//focus on textfield
$('#field').focus();
//On key down...
$('#field').keydown(function(event)
{
request=$(this).val();
count=$(this).val().length;
//Display chars as they come
$("#instruct").html(request);
// If "enter" is pressed
if (event.which == 13)
{
event.preventDefault();
//clean user entry
request=request.replace(/\n/g, "");
// Process user entry
$.ajax({
type: "POST",
url: "scripts/ajax/terminal.php",
data: {command:request},
success: function(response)
{
// if user typed something before pressing "enter"
if(response !='')
{
// update list by logging the previous entry, showing system response and clearing the textarea
$('#log').append("<li class='user'>--- ><span>"+request+"</span></li>");
$('#log').append("<li class='sys' >SYS ><span>"+response+"</span></li>");
$('#field').val('');
}
}
});
}
});
});
</script>
</head>
<body>
<ul id="log">
<li class='sys'>Sys ><span>Identification required</span></li>
</ul>
<ul id="realtime">
<li id="live-space">
<span class="user-line">--- ></span>
<textarea type="text" id="field"></textarea>
<div>
<span id="instruct"></span><div id="cursor">_</div>
</div>
</li>
</ul>
</body>
</html>
Я уверен, что "keyDown" запускается, когда это необходимо, потому что, когда я меняю это
$("#instruct").html(request);
в это
$("#instruct").html(request+'x');
... «x» появится сразу после первого нажатия клавиши, в то время как содержимое «запроса» будет отложено до следующего нажатия клавиши (например, если я наберу «a», я увижу только «x» и когда я наберу "б" сразу после, я вижу "топор" и т.д...).
Таким образом, речь идет не о нажатии клавиши, а о выборе правильного символа в нужное время.
Что я делаю неправильно?
Спасибо.
