jeditable意外触发嵌套项目上的Draggable [英] jeditable accidentally triggering on Draggable on nested items
问题描述
我正在使用jquery-ui的draggable进行拖放,并且可编辑用于内联编辑.
I'm using jquery-ui's draggable for drag-and-drop, and jeditable for inline editing.
当我拖放一个同样可编辑的元素时,将其拖放到可编辑的位置并弹出编辑模式".
When I drag and drop an element that's also editable, right after it's dropped jeditable kicks in and pops into 'edit mode'.
如何禁用此行为?
编辑-该问题是由于打网引起的-请参见此示例 .我还添加了可拖动对象,以使示例更加逼真(实际的实际问题在我正在的此站点中)正在工作)
Edit - the problem happens because of netsting - see this example. I also added draggable to the mix to make the example more realistic (the actual real problem is in this site that I'm working on)
注意-尽管由于赏金规则,该问题的答案已被接受,但该问题仍无法为我解决.
Note - even though this question has an accepted answer because of the bounty rules, the problem is still not resolved for me.
推荐答案
更新2:使用children()
UPDATED 2: use children()
演示2: http://jsbin.com/izaje3/2
回应您的评论
$(function() {
$('.editable').editable();
$('.draggable').draggable({
drag: function(event, ui) {
$(this).children('div').removeClass('editable')
},
stop: function(event, ui) {
$(this).children('div').addClass('editable')
}
});
});
$(function() {
$(".draggable").draggable({
drag: function(event, ui) {
$(this).unbind('editable')
}
});
$(".editable").editable();
});
或者您可以这样做:
$(function() {
$('.editable').editable();
$('.draggable').draggable({
drag: function(event, ui) {
$(this).removeClass('editable')
},
stop: function(event, ui) {
$(this).addClass('editable')
}
});
});
假设您有类似这样的内容:
Assuming you have something like this:
<div class="draggable editable"></div>
注意:只是为了方便起见,您还可以使用handle方法来利用它!
NOTE: just for sake, you can also take advantage by using the handle method!
这篇关于jeditable意外触发嵌套项目上的Draggable的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!