JQuery : 제출 버튼을 누르지 않고 데이터 제출?

Question

$(function(){ 
    $("input[type=text]").keypress(function(){ 
     $("#loader").load("saveinputtodatabase.php", {...}); 
    }); 
}); 

내 코드에서 정상적으로 작동합니다. 사용자가 입력 할 때마다 데이터베이스에 데이터를 저장합니다. 하지만 서버에서 여러 번 동일한 파일을 많이로드하므로 대역폭이 필요 이상으로 많이 사용되므로이 사실을 알지 못합니다.

사용자가 키를 누른 후 10 초가 지나면 "saveinputtodatabase.php"를 어떻게로드 할 수 있습니까?

Answer 1

setTimeout 및 clearTimeout을 사용할 수 있습니다.

$(function(){ 
    var timeout = 10000; // 10 seconds 
    var tmt = null; 
    $("input[type=text]").keypress(function() { 
    if (tmt) clearTimeout(tmt); 
    tmt = setTimeout(function() { 
     $("#loader").load("saveinputtodatabase.php", {...}); 
    }, timeout); 
    }); 
}); 

Answer 2

$(function(){ 
    $("input[type=text]").keypress(function(){ 
     var t=setTimeout(function(){ 
      $("#loader").load("saveinputtodatabase.php", {...}) 
     },10000); 
    }); 
}); 

Answer 3

var timeout; 
$('input[type=text]').keypress(function() { 
    if(timeout) { 
     clearTimeout(timeout); 
     timeout = null; 
    }  
    timeout = setTimeout(somefunc, 10000) 
}); 
function somefunc() { 
    $("#loader").load("saveinputtodatabase.php", {...}); 
} 

Answer 4

이

$(function(){ 
    $("input[type=text]").keypress(function(){ 
    save();   
}); 
}); 
function save(){ 
setTimeout($("#loader").load("saveinputtodatabase.php", {...}),10000) 
} 

Answer 5

체크 아웃이 underscore.js 기능을 시도해보십시오

http://documentcloud.github.com/underscore/#throttle

전달 된 함수의 새로운 조절 된 버전 을 작성하고 리턴합니다. 반복적으로 호출 될 때 실제로는 대기 밀리 초마다 한 번만 원래의 함수를 호출합니다. 따라 잡을 수있는 것보다 빠르게 발생하는 속도 제한 이벤트 에 유용합니다.

http://documentcloud.github.com/underscore/#debounce

작성하고 이후 가 호출 된 마지막 시간 이후 경과 한 시간 (밀리 세컨드 단위)을 대기 할 때까지 실행을 연기한다 전달 기능 의 새로운 디 바운스 버전을 반환합니다. 입력이 멈춘 후에 만 ​​발생해야하는 동작을 구현하는 데 유용합니다. 예 : Markdown 주석의 미리보기 렌더링, 창의 크기 조정이 중지 된 후 레이아웃 재 계산 등.

Answer 6

$('textarea').on('keyup', _.throttle(_.debounce(function() { 
$.ajax(...); 
}, 2000), 60000)); 

이것은 사용자가 2 초 이상 입력을 중지하는 즉시 데이터를 저장,하지만 더 매 번 이상 분합니다. checkout underscore.js 자세한 정보는