2012-12-22 1 views
1

CoffeeScript를 레일 애플리케이션에 사용하고 있는데 원격 AJAX 양식 제출을 지연해야합니다. 주된 문제는 양식을 한 번 보내도록 요청을 디 바운싱하는 것입니다. 사용자가 양식에 입력하지 않고 250ms가 경과했습니다.coffeescript를 사용하여 지연 (debounce) 아약스 요청

지금 당장 나는 이런 일이 벌어지고 분명히 작동하지 않을 것이고, 이것이 나를 도와 줄 일부 디버그 출력을 갖게 될 것입니다.

아래 표를 살펴보면, 내가 "디 바운스"하고 싶은 기능이 element.keyup (event) -> 함수 내에 있다는 것을 알고 있어야합니다.

remoteTable = 

    bindEvents: (element) -> 
    element.keyup (event) -> 
     console.log(event) 


    send: (event) -> 
    console.log(event) 

**이 작동 방식에 대한 몇 가지 예를 모을 수 있다면 정말 도움이 될 것입니다. ** 내가 underscore.js을 수행하지만 여기 방법을 참조했다, 이것은 나의 오래된 방법이다 : 난 그냥 주위에 내 머리를 정리하지 수있는 방법이해야 냄비 : 나는 주위를 연주

http://davidwalsh.name/function-debounce

답변

1

간단한 시간 제한을 사용하면 멋지게 할 필요가 없습니다.

remoteTable = 
    bindEvents: (element) -> 
    timeout = null 
    element.keyup (event) -> 
     clearTimeout(timeout) 
     timeout = setTimeout(remoteTable.send, 250) 

    send: -> 
    console.log('Sending request...') 
1

그들이 온라인이 coffeescript.org에 번역기/러너 "커피 스크립트 시도"

remoteTableOrg = 
    bindEvents: (element) -> 
    element.keyup (event) -> 
     console.log(event) 
    send: (event) -> 
    console.log(event) 

그래서

var remoteTableOrg; 

remoteTableOrg = { 
    bindEvents: function(element) { 
    return element.keyup(function(event) { 
     return console.log(event); 
    }); 
    }, 
    send: function(event) { 
    return console.log(event); 
    } 
}; 

012로 변환 보인다은 실제로 함수를 매개 변수로 사용하는 함수 호출입니다.

이보고, 나는

remoteTable = 
    bindEvents: (element) -> 
    element.keyup _.debounce((event) -> 
     console.log(event) 
    ,250) 
    send: (event) -> 
    console.log(event) 

을 시도하고있어 :

var remoteTable; 

remoteTable = { 
    bindEvents: function(element) { 
    return element.keyup(_.debounce(function(event) { 
     return console.log(event); 
    }, 250)); 
    }, 
    send: function(event) { 
    return console.log(event); 
    } 
}; 

나는 아무것도 시도하지 않았다하지만이 작동하지 않을 이유를 알고하지 않습니다. 나는 coffeescript로 많이하지 않는 것에 고백해야하지만 꽤 직설적 인 것처럼 보입니다.