변수에 고유 한 이름을 지정합니다. javascript/jquery

Question

텍스트 영역에서 keyup 이벤트가 발생한 후 1.5 초 후에 실행하는 함수를 설정하려고합니다. 그러나 같은 영역에서 다른 keyup 이벤트가 발생하면 다시 1.5 초로 시간을 연장하거나 이전 함수를 취소하고 새 함수로 업데이트하려고합니다.

더 재미있게 만들려면 xD 여러 텍스트 영역이 있으며 각 영역마다 고유 한 ID가 있습니다. keyup 이벤트가 동일한 텍스트 영역에있는 경우에만 취소 할 수 있습니다.

다음은 내가 시도한 예입니다.

이렇게하면 한 번만 지워지지만 덮어 씁니다. 그래서 배열을 사용하여 시도했지만 그 시간 초과를 저장할 수 있는지 잘 모르겠습니다.

제 질문이 너무 모호하면 그렇게 말하면 더 자세하게하려고 노력하겠습니다.

Answer 1

시간 제한 자체에 고유 ID는 필요하지 않으므로 .data() jQuery 기능을 사용하여 모든 요소에 대해 고유 한 시간 제한을 설정할 수 있습니다.

$(document).on("keyup",".edit_main textarea",function(e) { 
    var textArea = $(this); 
    var curval = textArea.val(); 
    var blue = "blue"; 

    clearTimeout(textArea.data().keyupTimeout); 

    textArea.data().keyupTimeout = setTimeout(function(){ 
     // do cool stuff 
     textArea.val('the cool result'); 
    }, 1500); 
    }); 

Answer 2

이것은 훨씬 복잡합니다. scope에 문제가있는 것으로 보입니다. 아래 문서화 된 코드 솔루션을 살펴보십시오. 또한 jsFiddle도 살펴볼 수 있습니다. 희망이 도움이됩니다!

//This needs to be declared OUTSIDE the function. 
var unique; 

//No need to use $(document), target your textareas directly. 
$('.edit_main textarea').on('keyup', function(e){ 

    //$(this) doesn't work here. Use e (an argument for the event). e.target.id gets the textarea's id. 
    var location_val = e.target.id; 

    //e.target.id returns just the id. 
    //We need to prepend the CSS selector for jQuery to find the element. 
    var curval = $('#'+location_val).val(); 

    //I don't see the point of blue = 'blue', so I omitted it. 

    //Clear the timeout first if any. 
    clearTimeout(unique); 

    //Set a new one. 
    unique = setTimeout(function(){ 

     //Do something cool. Like telling you what's in the textarea. 
     alert(curval); 

    }, 1500); 

});