2013-07-01 7 views
0

div를 드래그하고 크기를 재조정 할 수 있습니다.stopPropagation이 draggable resizble div에서 작동하지 않습니다

두 번 클릭하면 div의 내용을 선택할 수 있도록 stopPropagation을 사용하려고합니다.

하지만 어떤 이유로 stopPropagation이 작동하지 않습니다.

누구든지 내 코드를보고 내가 잘못 가고있는 곳을 참조 할 수 있습니까? 를 heres

jsfiddle

http://jsfiddle.net/j6FLa/16/

하고 코드

<HTML> 
<HEAD> 
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
<script src= "http://js.nicedit.com/nicEdit-latest.js"></script> 
<style> 
.dragbox { 
position:absolute; 
width:10px; 
height:25px; 
padding: 0.0em; 
margin:25px; 
cursor:move; 
z-index:2 
} 
</style> 
</HEAD> 

<BODY> 
<script> 
//<![CDATA[ 
bkLib.onDomLoaded(function() { 
    var myNicEditor = new nicEditor(); 
    myNicEditor.setPanel('myNicPanel'); 
    myNicEditor.addInstance('draggable'); 
}); 
//]]> 


$("div.dragbox").dblclick(function (e) { 
    $('.dragbox').css('cursor','select'); 
    e.stopPropagation(); 
}); 

$(function() { 
    $("#draggable").draggable().resizable(); 
}); 
</script> 
<div id="myNicPanel" style="width: 525px;"></div> 
<div id="draggable" class="dragbox" style="width:300px;height:300px;background-color:#ff0000;padding:25px;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed magna dolor</div> 
</BODY> 
</HTML> 
+0

내 inblox이 ... 어떤 아이디어를 내가이 질문에 3 개 의견이 있지만,이 페이지에 표시되지 않는 말한다? –

답변

1

이 해결 방법의 일종이 될 수 :

DEMO

$("div.dragbox").dblclick(function (e) { 
    $('.dragbox').css('cursor','select'); 
    $(this).draggable('disable').removeClass('ui-state-disabled').focus(); 
}).on('blur',function(){ 
    $(this).draggable('enable'); 
}); 

또는 더 나은 :

DEMO

$("div.dragbox").dblclick(function (e) { 
    if(!$(this).data('editing')){ 
    $('.dragbox').css('cursor','select'); 
    $(this).draggable('disable').removeClass('ui-state-disabled').focus(); 
     $(this).data('editing',true); 
    } 
    else { 
     $(this).data('editing',false); 
     $(this).draggable('enable') 
    } 
}); 
+0

필자의 웹 서버에서 시도해보십시오 ... 건배 –

+0

브라우저에서 아무 것도 작동하지 않습니다. :-( –

+0

캐시를 지우십시오. jsfiddle에서 작동하지만 서버에서는 작동하지 않습니다. –