클래스 요소에 포커스 또는 흐림

Question

입력 요소의 포커스를 잃을 때 클래스의 클래스를 변경하려고합니다. 이 프로젝트의 전제는 사용자가 일부 텍스트를 두 번 클릭 한 다음 해당 텍스트를 편집 할 수있게하는 것입니다. 그런 다음 필드에 집중하지 못하면 폼의 일부가 아닌 것처럼 보입니다. 내가 클릭을 두 배로 때

$('.actdblclk').dblclick(function(){ 

    $(this).removeClass('actdblclk').addClass('actdblclk_active').focus(); 

}); 

$('.actdblclk_active').focusout(function(){ 
    alert(); 

    $(this).removeClass('actdblclk_active').addClass('actdblclk'); 
}); 

내가 입력 필드에 초점을 얻을 수 있지만 오프 클릭하면 대한 focusOut 이벤트가 발생하지 않습니다

내 문제는 여기에있다.

는 다음 순간에이 클래스 .actdblclk_active 아무 요소가 없었다 할당 때문에 대한 focusOut() 이벤트 핸들러는 발생하지 않습니다 http://www.jsfiddle.net/t8JsG/

Answer 1

전체 바이올린을합니다. 이 같은

당신은 dblclick (내부에 대한 focusOut() 핸들러를 할당해야합니다) :

$('.actdblclk').dblclick(function(){ 
    $(this).removeClass('actdblclk').addClass('actdblclk_active').focus(); 
    $(this).focusout(function(){ 
    alert(); 

    $(this).removeClass('actdblclk_active').addClass('actdblclk').unbind('focusout'); 

    }) 
}); 

업데이트 : 두 번째 옵션은 다음과 같이 jQuery.live()를 사용하여 대한 focusOut() 핸들러를 할당하는 것입니다 :

$('.actdblclk_active').live('focusout', function(
    alert(); 
    $(this).removeClass('actdblclk_active').addClass('actdblclk');) 
}); 

이 핸들러는 현재와 .actdblclk_active 셀렉터에 일치하는 미래의 요소에 할당됩니다 이런 식으로

Answer 2

당신 핸들러를 라이브 이벤트 핸들러로 추가 할 수 있습니다. 이렇게하면 실시간 처리기는 항상 일치하는 선택기 내에서 이벤트를 찾습니다.

$('.actdblclk').dblclick(function(){ 

    $(this).removeClass('actdblclk').addClass('actdblclk_active').focus(); 

}); 

$('.actdblclk_active').live('focusout', function(){ 
    $(this).removeClass('actdblclk_active').addClass('actdblclk'); 
}); 

Answer 3

페이지가로드 될 때 actdblclk_active 클래스의 페이지에 요소가 없습니다.

는 원래 클래스를 사용하여 focusout 핸들러를 지정해야합니다 :

$('.actdblclk').dblclick(function(){  
    $(this).removeClass('actdblclk').addClass('actdblclk_active').focus(); 
}).focusout(function(){ 
    $(this).removeClass('actdblclk_active').addClass('actdblclk'); 
});