[英]jquery ui two draggables conflict
我的内里有两个div。 我不想执行一些JavaScript逻辑,并且根据结果允许拖动#c或继续#a上的事件。 这个怎么做?
HTML:
<div id='a'>
<div id='b'>content</div>
<div id='c'>#a must drag</div>
</div>
JS:
var drag = false;
setInterval(function(){
if(drag){
drag = false;
$('#c').text('#a must drag');
}else{
drag = true;
$('#c').text('#c must drag');
}
},2000);
$(function(){
$('#a').draggable({
handler:'#c'
});
$('#c').draggable({
start:function(event,ui){
if(drag == false){
//proxy event to #a or simply allow dragging of #a
}
}
});
});
更新:
我需要:如果drag = false,那么#a可由处理程序#c拖动,如果drag = true,则仅#c是可拖动的。
在http://jsfiddle.net/52FQX/3/上更新了示例
不知道我是否了解您的要求。但是,如果您只希望容器拖动山墙直到它切换,反之亦然,那么您走在正确的轨道上,我将使用drag
事件而不是start
因为拖动会触发全程。
$('#a').draggable({
drag:function(event,ui){
if(drag){
//proxyfi event to #a or simply allow dragging of #a
return false;
}
}
});
$('#c').draggable({
drag:function(event,ui){
if(drag ==false){
//proxyfi event to #a or simply allow dragging of #a
return false;
}
}
});
例
更新
$('#a').draggable({
drag:function(event,ui){
if(drag){
return false;
}
},
handle: "#c"
});
$('#c').draggable({
drag:function(event,ui){
if(drag ==false){
return false;
}
},
disabled: true
});
CSS
.ui-state-disabled {
opacity:1;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.