텍스트 선택 릴리즈를 창에서 업데이트하는 방법

Question

사용자 마우스를 사용하여 selected 텍스트를 가져 와서 컨테이너로 업데이트 중입니다. 사용자가 클릭 (선택 해제)을 클릭하면 selected 텍스트를 비어있는 것으로 업데이트하고 싶습니다.

난이 방법을 시도

하지만 제대로 작동하지 않는 것 같다,

$('#tenderContent').on('mouseup', '.tenderdocument', function(e){ 
    e.stopPropagation(); 
    if($.trim(window.getSelection().toString()).length) { 
     $('#text').text(window.getSelection().toString()); 
    } 
}); 

$('#tenderContent').on('click', '.tenderdocument', function() { 
    var selection = $.trim(window.getSelection().toString()); 
    if(!selection) { 
     console.log("there is no selection"); //nothing consoles after selection released 
     $.event.trigger({type:'textUnselected'}); 
    } 
}); 

Live

당신은 단지 업데이트하기 전에 선택를 확인하는 if 조건을 제거 할 필요가

Answer 1

:

$('#tenderContent').on('mouseup', '.tenderdocument', function (e) { 
    e.stopPropagation(); 
    $('#text').text(window.getSelection().toString()); 
}); 

업데이트

당신은 선택이 취소되어 특정 기능을 실행하려면 6,

,이 시도 : 클릭이 외부에서 발생하는 경우

$('#tenderContent').on('mouseup', '.tenderdocument', function (e) { 
    e.stopPropagation(); 
    if ($.trim(window.getSelection().toString()).length) { 
     $('#text').text(window.getSelection().toString()); 
    } 
    else { 
     $('#text').empty(); 
     console.log("there is no selection"); //nothing consoles after selection released 
     $.event.trigger({ type:'textUnselected' }); 
    } 
}); 

Updated fiddle

Answer 2

당신 만의 #tendercontent 내부 .tenderdocument 요소의 클릭에 대한보고 너는 눈치 채지 못할거야.

시도는 다음과 같이, 모든 클릭을 잡으려고 문서 수준에 바인딩 :

$('#tenderContent').on('mouseup', '.tenderdocument', function(e){ 
    e.stopPropagation(); 
    if($.trim(window.getSelection().toString()).length) { 
     $('#text').text(window.getSelection().toString()); 
    } 
}); 

$(document).on('click', function (e) { 
    var selection = $.trim(window.getSelection().toString()); 
    if(!selection && !$('#text').is(':empty')) { 
     $('#text').empty(); 
     alert('text emptied!'); 
    } 
}); 

JSFiddle을 : http://jsfiddle.net/hdaj1t7w/3/