2015-01-26 1 views
0

div에 포함 된 몇 가지 컨트롤이있는 양식이 있습니다. 우리는 사용자가 일종의 편집 모드로 들어가도록 허용 한 다음 모든 컨트롤을 보유하는 메인 div를 포함하여 원하는대로 컨트롤을 이동하고 크기를 조정할 수 있습니다.jQuery 상위에서만 크기 조정 가능 비활성화

너무 자세히 설명하지 않고도 주 div와 모든 하위 항목에서 다시 크기 조정할 수 있습니다. 어떤 시점에서 나는 모든 자식을 그대로두고 부모의 크기 조정 만 비활성화하려고합니다.

그러나 jQuery가 부모에서 크기 재조정을 사용하지 않도록 설정하면 해당 자식에 대해 자동으로 똑같이 수행됩니다.

크기를 조정할 수있는 모든 항목을 모두 삭제 한 다음 방금 어린이를 위해 다시 처리하면 해결할 수 있지만 필요에 따라 사용하도록 설정하고 사용하지 않으려합니다.

그래서 $('#SomeID').resizable('disable')으로 전화하면 어린이 컨트롤에 영향을 미치지 않습니다.

누구든지이 작업을 수행 할 수 있습니다.

+0

코드를 제공하면 anwser를받을 확률이 더 높아집니다. –

+0

당신은 질문과 같은 날 게시 된 Nick의 답을 어떻게 얻었습니까? – halfer

답변

0

이 (가 있기 때문에 크기 조정 방법을) JQueryUI를 사용하는 가정 : 특정 요소에서 크기 조정 기능을 제거하려면

당신이 할 수있는 당신의 요소에서 관련 클래스를 삭제하여

$(document).on('click', '.child', function() { \t 
 
\t $(this).removeClass('ui-resizable'); 
 
}); 
 

 
$(document).on('click', '.container', function() { \t 
 
\t $(this).removeClass('ui-resizable'); 
 
}); 
 

 
$(document).ready(function() { 
 
\t \t $(".container").resizable(); 
 
\t \t $(".child").resizable(); 
 
});
.container { 
 
    width: 200px; 
 
    height: 400px; 
 
    background-color: blue; 
 
} 
 

 
.child { 
 
    width: 100px; 
 
    height: 100px; 
 
    background-color: green; 
 
    border: 2px solid black; 
 
}
<html> 
 
<body> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
 
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" /> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script> 
 
\t <div class="container"> 
 
\t \t <div class="child"> 
 
\t \t </div> 
 
\t \t <div class="child"> 
 
\t \t </div> 
 
\t \t <div class="child"> 
 
\t \t </div> 
 
\t </div> 
 
</body> 
 
</html>

당신이 특정 요소 만 크기 조정 기능을 제거하는 요소를 클릭합니다.