1

我在表格中使用拖放元素。但我还需要将元素拖出表格,并将它们放在“bin icon”上以删除它们。

拖放在表格中效果很好,但是当我想拖出表格时,它们被隐藏(它们位于我页面的其他元素下)。我已经尝试了 z-index 和 position 属性,但没有成功。

有人有想法吗?

我谈论 html 的这些部分:

<div id="calendar">
  <div class="ui-widget wc-container">
    <div class="ui-widget-header wc-toolbar">
      <div class="ui-widget-content wc-header">
        <div class="wc-scrollable-grid" style="height: 416px;">
          <table class="wc-time-slots">
            <tbody>
              <tr class="wc-grid-row-timeslot">
              <tr class="wc-grid-row-oddeven">
              <tr class="wc-grid-row-events">

这些元素在 wc-grid-row-events 中,我想将它们放在 wc-header 上

我的 javascript 是:

        $calEvent.draggable({
            containment: '#Calendrier', //pour permettre le drag des saisies jusqu'à l'icône corbeille
            revert: 'invalid',
            opacity: 0.5,
            start: function (event, ui) {
                var $calEvent = ui.draggable || ui.helper;
                options.eventDrag(calEvent, $calEvent);
                ui.helper.css("z-index", "10");
                ui.helper.css("position", "absolute");
            }
        });
4

2 回答 2

1

没有示例代码很难提出建议。但是,假设您正在使用可拖动的设施。

$("#draggableid").draggable({ containment: "document" }); 

这应该适用于您的情况。默认情况下,包含是父级,在您的情况下是表。但如果你把收容作为文件。可以在整个文档中拖动窗口。

你不应该使用 tr 作为你的可拖动元素。如果您希望行可拖动,请使用“div”“ul”和“li”标签。由于它们不会成为表格的一部分,因此您可以轻松地将它们拖到任何地方。

参考来源:http: //jqueryui.com/demos/sortable/

于 2012-08-13T13:45:37.643 回答
0

你在使用jQuery UI Draggable 吗?
如果是这样,我认为该appendTo选项在您的情况下很有趣:

appendTo 选项传递或选择的元素将在拖动过程中用作可拖动助手的容器。默认情况下,助手被附加到与可拖动对象相同的容器中。

例如:

$( ".selector" ).draggable({ appendTo: "body" });
于 2012-08-13T13:44:26.663 回答