집계 흐림 이벤트는

Question

사용 사례 조회수 : 내가 hide() 원하는하는 div#callout이

그것을 경우 사용자 중 하나를 클릭하여 다른 객체 (스크롤하거나 시간 제한하지만 아무것도하지 않고 120 초). 그러나 사용자가 #callout 또는 그 안의 개체를 클릭하면 hide() 작업을 수행하지 않습니다. 또한 input과 같은 자식 요소에 포커스가있는 경우 시간 초과가 효과적이지 않습니다 (사람들이 입력하는 경우).

아이디어 : 나는 "blur:callout"

도전 같은 트리거 Backbone.Events 그 세 가지 이벤트 중 하나를 확장하여 집계 이벤트를 만들 계획입니다

:

를 나는 내가 할 수있는 것 같아요 스크롤 감지 및 타임 아웃을 수행하지만 어딘가에서 클릭을 감지하는 방법은 무엇입니까? #callout? 나는 100 개가 될 수 있고 성장할 수 있기 때문에 모든 다른 뷰와 하위 뷰에 대한 트리거 이벤트를 추가하고 싶지 않습니다.

Answer 1

기본적으로 사용자는 120 초 이내에 div#callout을 클릭해야합니다. 그렇지 않으면 숨길 것입니다. 이

사용자가 div#callout 무시 페이지를로드 한 후 1백20초 내에서 즉 숨 깁니다 전에 선 내부

1. 사용자의 클릭 및 자동 숨겨져 : 당신은 다음 2가지 경우가 있습니다.

사용자가 callout과 상호 작용하지 않으면 걱정할 필요가 없습니다. 걱정해야 할 유일한 경우는 사용자가 callout을 클릭했는지 여부입니다.

따라서 중첩 된 뷰가 많은 경우가 아니면 div#callout에 문제가 없습니다.

div#callout 안에 많은 중첩 된보기가있는 경우 어떤 종류의 상속 또는 혼합을 통해 각 자식에게 reset hide 이벤트를 첨부 할 수 있습니다. 난 당신이 바로, 나는 이런 식으로 뭔가 할 것 얻었다 경우

Answer 2

: 당신이 다시 제한 시간을 설정해야하는 경우

var Callout = Backbone.View.extend({ 

    events: { 
    "click": "clearTimeout" // clear timeout if clicked inside 
    }, 

    render: function() { 
    // render and then 
    this.setTimeout(); 
    return this; 
    }, 

    setTimeout: function() { 
    var self = this; 
    if (!this.timeout) { 
     this.timeout = setTimeout(function() {self.hide();}, 120 * 1000); 
    } 
    return this; 
    }, 

    clearTimeout: function(){ 
    if (this.timeout) { 
     clearTimeout(this.timeout); 
    } 
    return this; 
    }, 

    hide: function() { 
    this.$el.hide(); 
    return this; 
    } 
)} 

이벤트 해시 대신 흐림 이벤트 (같을 것이다을 focusout 이벤트는 jQuery를 거품)

events: { 
    "focusout": "setTimeout", 
    "focusin": "clearTimeout" 
} 

UPD : Callout보기 중 focusout 이동 초점이, 당신이 이벤트의 relatedTarget를 확인해야합니다 수 있도록하는 것은 없습니다 내부 뷰의 $el을합니다.