如何删除div的可拖动事件?
我想将新的.point添加到容器中,然后draggablge它,但首先我要取消绑定$('。piont')的所有可拖动事件,该怎么做?
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.8.2/jquery-ui.js"></script>
<style type="text/css">
*{margin:0;padding:0}
.container{
margin:50px;
width:100px;
height:100px;
border:1px solid #777;
position:relative
}
.point{
width:20px;
height:20px;
background-color:tan;
position:absolute;
}
</style>
<script type="text/javascript">
$(function(){
$('.point').draggable({
stop: function (e){
alert(1);
}
});
});
function unbind_draggable(){
// how can unbind draggable for .point?
}
</script>
<div class="container">
<div class="point"></div>
<div class="point"></div>
<div class="point"></div>
<div class="point"></div>
</div>
<button onclick="unbind_draggable()">unbind_draggable</button>
答案 0 :(得分:6)
删除可拖动事件:
$( ".selector" ).draggable( 'disable' ); OR
$( ".selector" ).draggable( 'destroy' );
进一步详情检查jQuery UI API文档。 Click here
对于你的问题:
function unbind_draggable(){
$('point').draggable( 'destroy' );
//OR
$('point').draggable( 'disable' );
}
答案 1 :(得分:2)
要从所有.point
中删除可拖动,请使用:
function unbind_draggable(){
$(".points").draggable("destroy");
}
这将删除所有可拖动的功能,而不仅仅是禁用它。
请参阅jQuery UI API。
虽然只是禁用会起作用,但我不推荐它,因为它不会清除jQuery draggable占用的RAM。
答案 2 :(得分:0)
$('.point').droppable('disable');
答案 3 :(得分:0)
<强> JS: - 强>
$(function () {
$('.point').draggable({
stop: function (e) {
alert(1);
}
});
});
function unbind_draggable() {
$('.point').draggable("destroy");
}