Я создаю окно поиска (поле ввода), которое должно сделать вызов сервера для фильтрации сетки с вставляемым текстом, но мне нужно сделать это разумным образом, мне нужно пожара вызова сервера, только если пользователь остановился. Сейчас я пытаюсь его реализовать, но если кто-то знает, как это сделать, я буду очень доволен. В любом случае, если я сделаю это сначала, я отправлю ответ здесь ... С наилучшими пожеланиями, Jaime.Определить, когда пользователь вводит
ответ
- При нажатии клавиши:
- Проверьте, есть ли существующий таймер - остановить его, если есть один
- запустить таймер.
- Когда таймер истекает, вызовите метод сервера.
var searchTimeout;
document.getElementById('searchBox').onkeypress = function() {
if (searchTimeout != undefined) clearTimeout(searchTimeout);
searchTimeout = setTimeout(callServerScript, 250);
};
function callServerScript() {
// your code here
}
Я не знаю много о JavaScript, но вы можете использовать таймер (позволяет сказать, что установлен на 5 секунд), который получает сброс на каждом событии изменения от вашего ввода. Если пользователь перестает печатать более 5 секунд, таймер истекает и запускает отправку.
Проблема с этим подходом заключается в том, что подача запускается при каждой паузе, например. если пользователь перестанет печатать, чтобы рассказать о кофе-брейке. Вам нужно будет убедиться, что это приемлемо для пользователей.
Вы можете использовать вызовы setTimeout
, которые вызывают функцию вашего сервера (с задержкой 2-3 секунды) в событии нажатия клавиши. Как только нажата клавиша, отмените предыдущий вызов setTimeout
и создайте новый.
Затем, через 2-3 секунды без нажатия клавиш, событие сервера будет запущено.
благодарит за ваш отзыв. я реализовал этот кусок кода, и кажется, что он делает работу (с помощью JQuery):
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
var interval = 500;
var filterValue = "";
$(document).ready(function() {
$(".txtSearch").bind("keypress", logKeyPress);
});
function logKeyPress() {
var now = new Date().getTime();
var lastTime = this._keyPressedAt || now;
this._keyPressedAt = now;
if (!this._monitoringSearch) {
this._monitoringSearch = true;
var input = this;
window.setTimeout(
function() {
search(input);
}, 0);
}
}
function search(input) {
var now = new Date().getTime();
var lastTime = input._keyPressedAt;
if ((now - lastTime) > interval) {
/*console.log(now);
console.log(lastTime);
console.log(now - lastTime);*/
if (input.value != filterValue) {
filterValue = input.value;
//console.log("search!");
alert("search!");
}
input._monitoringSearch = false;
}
else {
window.setTimeout(
function() {
search(input);
}, 0);
}
}
</script>
Вот простой который будет работать без jQuery:
<input type="text" id="TxtSearch" onchange="countDown=10;" />
<script type="text/javascript">
var countDown = 0;
function SearchTimerTick()
{
if(countDown == 1)
{
StopTypingCommand();
countDown = 0;
}
if(countDown > 0)
countDown--;
}
window.setInterval(SearchTimerTick,1000);
</script>
Возможно, вы также захотите проверить длину строки на поле ввода, иначе рискуете получить огромный набор результатов!
Убедитесь, что таймер имеет задержку, какую бы длинную вы не считал «сделанной набивкой», чтобы вы не ловили небольшие паузы. Кроме того, используйте событие onblur, чтобы увидеть, когда пользователь щелкнет текстовое поле. – Karl 2008-12-11 16:17:37
Да, задержка должна зависеть от того, насколько интенсивным будет поиск, насколько он вам необходим, а также: как быстро ваши пользователи обычно печатают. Я использовал 250 мс для поиска, и это была прекрасная ИМО. – nickf 2008-12-11 16:20:30
не должно быть событие onkeypress или что-то в этом роде? – 2008-12-11 18:12:59