Легкий, но зависит от того, что именно вы хотите сделать. Вот несколько примеров фрагментов коды:
<?php
if(!empty($_POST['lname'])) {
$valueOfInput = $_POST['lname'];
die(json_encode(array('status' => 'success', 'lname' => $valueOfInput)));
}
?>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
</head>
<body>
<input type="text" id="lname" name="lname" value="" />
<script type="text/javascript">
$(document).ready(function() {
$("#lname").on("keypress", function() { // waiting for keypress event to be fired
setTimeout(function() { // delay to have the key value inserted into input, and affect value param
$.post(document.location.href, { lname: $("#lname").val() }, function(data) { // sending ajax post request
console.log(data);
});
}, 50);
});
});
</script>
</body>
</html>
Вы не писали о каких-либо рамках JS, но я предположил, что это будет проще для вас (для начинающих), чтобы начать с JQuery или какой-либо другой структурой, которые могут помочь вам некоторые абстракции вокруг функций JS.
Вот краткое описание того, что происходит:
сайт ждет, пока вы начнете писать что-либо на вход (так же, как в вашем коде)
сценарий обработки набрав событие (нажатие клавиши) и жду, пока значения вставляются в ваш вход
скрипта посылает запрос Ajax с входным значением, как пары
PHP код принимает значение от $ _POST суперглобального массива, и вставляет его в PHP переменной
PHP код отправляет ответ на сценарий JS, что все хорошо, и этот ответ напечатан в вашей консоли (вы можете делать все, что вы хотите - надо с ним)
Выпуск: Он будет посылать много запросов на сервер, поэтому рассмотрим более подход (change
событие вместо keypress
)
вы должны понимать разницу? между серверным кодом и кодом на стороне клиента. – SLaks
Возможный дубликат [Ссылка: Почему код PHP (или другой сервер) в моем Javascript не работает?] (Http://stackoverflow.com/questions/13840429/reference-why-does-the-php-or- другой-серверный код-в-мой-на JavaScript не-УНР) – Quentin