在可放置 div 内的 div 中附加文本框时

Question

我有一个 div，我要在其中删除和附加文本框，这工作得很好，但问题是我在该 div（如部分）中还有一个 div，我必须在其中删除和附加相同的文本框，但它现在下降了两次，一个用于内部 div，另一个用于外部 div，但我只想要内部 div。我试过谷歌，但找不到太多帮助。因此，如果有人对此有任何想法，那将非常有帮助。 谢谢。

http://jsfiddle.net/Dw66V/

这里是代码，但不完整，因为它非常复杂

     $(function () {
                        var $Drag_tbox = $("#Drag_tbox"),                       
                            $drop_box = $("#tabs-1"),
                            $drop_box_sec = $("#secdiv");


                $Drag_tbox.draggable(
                        {
                            zIndex: 9003,
                            revert: "invalid",
                            helper: "clone",
                            drag: function (event, ui) {
                                num = 1;
                                return num;
                            }
                        });



                $drop_box_sec.droppable({
                    zIndex: 9003,
                    drop: function (event, ui) {

                            if (num == 1) {
                                $drop_box_sec.append('<tr><td align="center"><asp:Label runat="server" Text="Label"></asp:Label><input id="Text1" type="text" /></tr></td>');                          
                            }

                    }

                });


                $drop_box.droppable({
                    zIndex: 9003,
                    drop: function (event, ui) {

                            if (num == 1) {
                                $drop_box.append('<tr><td align="center"><asp:Label runat="server" Text="Label"></asp:Label><input id="Text1" type="text" /></tr></td>');

                            }                       

                    }



     });
});

Answer 1

好吧，您可以在触发内框的事件时取消绑定外框的事件，然后在完成后再次绑定它。如果你使用 jQuery，你可以使用 off() 或 unbind()。请发布您的代码，以便我参考。

---

看到代码后： http://jsfiddle.net/Dw66V/3/

我添加了一个可拖动的 div。现在会发生什么，当在内部元素上放置某些东西时，外部元素 droppable 会被禁用，然后在短暂超时后再次启用。

$drop_box_sec.droppable({
  drop: function (event, ui) {
    $drop_box.droppable('option', 'disabled', true);
    // Your code here
    setTimeout(function () {
      $drop_box.droppable('option', 'disabled', false);
    }, 500);
  }
});

---

更好的方法：）（来自Jquery drop callback of droppable method called twice）

只需将选项“贪婪”添加到内部 div，如下所示：

$drop_box_sec.droppable({
  greedy: true,
  drop: function (event, ui) {
    // Your code here
  }
});

开箱即用，效果很好。 http://jsfiddle.net/Dw66V/4/