指定何时拖动可拖动的div

Question

是否有可能使div可拖动并且说只有当用户点击该div中的特定元素时才应该拖动div？我有一个带有标题元素的可拖动div。我想只在单击元素时才进行拖动。

以下是我将div设为可拖动的javascript。

<script>
$(function() {
    $( "#edit" ).resizable();
    $( "#edit" ).draggable();
});
</script>

这是div的HTML

<div class="demo">

<div id="edit" style="position:absolute; width: 250px; height: 550px;" class="comdiv">
    <h3 class="comhdr ui-widget-header">Sample</h3>

        <p id="heading" class="editableText ui-widget-content">Text for edits.</p> 

</div>

</div><!-- End demo -->

http://jsbin.com/awihej/2/edit

Answer 1

您可以使用handle选项：

$("#edit").draggable({
    handle: "h3"
});

或者也许：

$("#edit").draggable({
    handle: ".ui-widget-header"
});