2017-11-08 1 views
0

나는 onclick 이벤트가있는 "appt"클래스가있는 페이지에 여러 div가 있습니다. jquery UI를 사용하여 같은 div를 크기를 조정할 수 있도록 노력하고 있습니다.jQuery 및 크기 조정 트리거 onclick 이벤트

문제는 resize 이벤트가 onclick 이벤트를 트리거한다는 것입니다. 내가 시도했던 성공하지 다음을 클릭 중의 요소 대신 크기 조정 핸들의 실제 요소 인 경우,

$(".appt").resizable({.....}).on('resize', function (e) { e.stopPropagation(); });

답변

1

당신은 확인할 수 있습니다. 아래 예제에서는 크기 조절이 가능한 핸들을 클릭 할 때 onclick 기능을 실행하지 않습니다.

$('.appt').click(function(e) { 
 
    if (e.target === this) { 
 
    console.log('I am being clicked'); 
 
    } 
 
}); 
 

 
$('.appt').resizable();
.appt { 
 
    height: 100px; 
 
    width: 100px; 
 
    border: 1px solid red; 
 
}
<div class="appt"></div> 
 
<div class="appt"></div> 
 
<div class="appt"></div> 
 
<div class="appt"></div> 
 
<div class="appt"></div> 
 

 
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js" integrity="sha256-eGE6blurk5sHj+rmkfsGYeKyZx3M4bG+ZlFyA7Kns7E=" crossorigin="anonymous"></script>

관련 문제