Jquery kendoDraggable把手内侧div

Jquery kendoDraggable把手内侧div,jquery,drag-and-drop,kendo-ui,Jquery,Drag And Drop,Kendo Ui,我对拥有kendoDraggable和jQuery可调整大小的div有一个问题。当我调整大小时,drag'n'drop事件被触发,所以我有了调整大小的提示和停止事件。 我的目标是将带有句柄的kendoDraggable限制为可调整大小,但我没有在这个句柄上初始化事件,而是在整个div上启动了移动 这里是要移动的div上生成的html代码 <div id="vignette_4" class="vignette vignetteFemme ui-resizable" style="posit

我对拥有kendoDraggable和jQuery可调整大小的div有一个问题。当我调整大小时,drag'n'drop事件被触发,所以我有了调整大小的提示和停止事件。 我的目标是将带有句柄的kendoDraggable限制为可调整大小,但我没有在这个句柄上初始化事件,而是在整个div上启动了移动

这里是要移动的div上生成的html代码

<div id="vignette_4" class="vignette vignetteFemme ui-resizable" style="position: absolute; top: 514px; left: 298px; width: 153px;">
<span class="libelleVignette">Raymonde BIDOCHON 22/08/1978 11110011</span>
<img src="Content/images/info_rhombus.png" class="detailVignette">
<div class="draggable" data-role="draggable" style="position: absolute; top: 3px; left: 15px; width: 123px; height: 3px; background-color: rgb(0, 0, 0);"></div>
<input type="hidden" id="LitId" value="11">
<input type="hidden" id="HospitId" value="1326">
<input type="hidden" id="HospiDateDebut" value="/Date(1388444400000)/">
<input type="hidden" id="HospiPeriodeDebut" value="1">
<input type="hidden" id="HospiDateFin" value="/Date(1388444400000)/">
<input type="hidden" id="HospiPeriodeFin" value="3">
<div class="ui-resizable-handle ui-resizable-w" style="z-index: 90;"></div>
<div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>
</div>

但只有处理程序被移动。

因为回答我的问题是可以的,而且下面的答案可能会很有用:)

将提示移动到父级,它就工作了

$(".draggable").kendoDraggable({
    hint: function (vignette) {
        var v = $(vignette).parent().clone();
        v.removeClass();
        var w = v.width();
        v.css({
            "border":"1px dashed gray",
            "width": w + "px"
        });
        return v;
    },
    cursorOffset: { top: 5, left: 5 }
});
$(".draggable").kendoDraggable({
    hint: function (vignette) {
        var v = $(vignette).parent().clone();
        v.removeClass();
        var w = v.width();
        v.css({
            "border":"1px dashed gray",
            "width": w + "px"
        });
        return v;
    },
    cursorOffset: { top: 5, left: 5 }
});