2012-05-08 7 views
1

현재 대화 형 웹 애플리케이션에서 작업 중이며, 현재 http://picselbocs.com/projects/goalcandy (사용자 : [email protected], 비밀번호 : 데모)에 설정되어 있습니다. 왼쪽 사이드 바의 이미지 및/또는 텍스트가 포함 된 항목을 오른쪽의 작업 공간으로 드래그하고 크기 조정/편집 할 수 있습니다.블러 이벤트 핸들러가 jquery preventDefault() 메소드에 의해 차단되었습니다.

생성 된 개체의 텍스트를 편집하려면 텍스트 필드 (제목 또는 설명)를 클릭하기 만하면됩니다. 해당 <span> 요소는 <textarea>으로 바뀌며 콘텐츠를 편집 할 수 있습니다. "blur"이벤트가 발생하면 텍스트 영역이 사라지고 해당 값이 <span> 요소에 추가됩니다. 문제는 개체의 이미지를 클릭하면 (이미지와 텍스트 필드가 모두있는 경우) "흐림"이벤트가 발생하지 않도록하는 것입니다.

이미지를 부모 개체와 별도로 끌지 않도록 다음 스 니펫을 사용하여 문제의 원인을 파악했습니다. 하지만이를 사용하지 수 없으며, 동시에 나는 그것을 사용하지 가지고, 나는이 문제를 해결받을 수있는 방법

$(document).on('mousedown dragstart', 'img', function(event) { event.preventDefault(); }); 

을하고 이미지를 클릭 할 때에 onblur 이벤트 핸들러도 실행할 수 있지만, 동시에 기본 행동 방지를 유지합니까?

추신 : alert('blur') 전화는 이벤트가 발생하면 모니터링 할 수 있습니다. 에서

$(document).on('mousedown dragstart', 'img', function(event) { 
    if (locks.textarea_lock) { 
     return; 
    } 
    event.preventDefault(); 
}); 

이 핸들러는 locks.textarea_lock = false; 변수의 잠금을 해제 "흐리게"당신은 몇 가지 변수를 사용

+0

이미지를 클릭하면 "흐리게"실행됩니다. 어떤 브라우저를 사용합니까? –

+0

@Denis Ermolin 죄송합니다, 주석 처리되지 않은 주석이 달린 스크립트를 저장하는 것을 잊었습니다. 다시 시도하십시오. –

답변

1

var locks = {}; 
locks.textarea_lock = false; 

그런 다음 텍스트 영역 이미지 처리기에서 locks.textarea_lock = true;이 잠금을 확인 설정 클릭 말한다.

+0

운이 없다, 행동은 변하지 않았다. –

+0

내가 편집 한 답변 –

+0

감사합니다. 나는이 생각을 조금 비틀었다. 그리고 그것은 내가 필요로하는 것이었다. 기원합니다. –