禁用特定分区的可拖动功能

Question

crop_popup_box

<div id="crop_box" class="popup_box crop_popup">
<span class="popup-title" id="popup_title">Crop Image</span>    
<div id="crop_div" style="display:none;">
    <div style="margin-left:60px;" class="example">
        <div class="default">
            <div  class="cropMain"><div class="crop-container" style="width: 320px; height: 320px;"><div class="crop-overlay" style="z-index: 6000; top: 0px; left: 0px;"></div><img class="crop-img" src="./jQuery & Canvas Image Cropper_files/one.jpg" style="z-index: 5999; top: -149.8px; left: -622.6650049850448px; width: 1402.7676969092722px; height: 549.6px;"></div></div>
            <div class="cropSlider horizontal"><a style="left: 43%; z-index: 1;"><div class=""></div></a><input type="hidden" name="" value="2.29"></div>
        </div>
       </div>
</div>
</div>

script.js

 $(function() {
        $( ".popup_box" ).draggable();         
  });

我已经将可拖动属性应用于这个裁剪弹出窗口。我可以拖动整个弹出窗口。是否可以限制div中cropSlider horizontal类的可拖动函数。如果使用单击div cropSlider horizontal并拖动，则弹出窗口不应被拖动，因为我在该div中使用缩放栏。使用缩放栏时，弹出窗口会被拖动，无法缩放图像。

我试过了，

$('div.cropSlider').draggable( "disable" )

它不起作用。需要帮助

Answer 1

您也可以在以后需要时禁用：

$('div.cropSlider').draggable();  
$('div.cropSlider').draggable( "option", "disabled", true );

Answer 2

尝试使用：

$('.popup_box div.cropSlider').draggable({disabled: true});

Answer 3

使用：

$(".popup_box").children('.cropSlider').draggable({disabled:true});