jquery 获取删除区域ID

a64a0gku 于 2023-03-07 发布在 jQuery

关注(0)|答案(1)|浏览(174)

我有一个网页分为两列，左边一列，右边一列是树结构。现在，我想把列表项放到特定的树节点上，我可以做到这一点。但是我只能得到列表项的id，而不能得到项被放下来的节点的ID。
列表项具有类“ttlTipBU”

$(".ttlTipBU").draggable({
            revert: "invalid",
            refreshPositions: true,
            drag: function (event, ui) {
                ui.helper.addClass("draggable");
            },
            stop: function (event, ui) {
                ui.helper.removeClass("draggable");
                var contactID = $(this).find('div').html();
                console.log('this is contact ID----'+  contactID);

            }
        });

对于树结构节点，我们在每个节点上实现的类是“orgNodeMap“，但当我将其放在节点上时，它不会执行以下操作

$("div.orgNodeMap").on("drop", function (event, ui) {
            console.log('not coming here');
 });

jquery

来源：https://stackoverflow.com/questions/46886319/get-dropped-area-id

1条答案

按热度按时间

mwg9r5ms1#

您必须检查项目何时收到，而不是使用sortable删除项目的时间。

$(".ttlTipBU").sortable({
  revert: "invalid",
  refreshPositions: true,
  connectWith: ".ttlTipBU",
  drag: function(event, ui) {
    ui.helper.addClass("draggable");
  },
  receive: function(event, ui) {
    console.log('this is contact ID---- ' + this.id);
  }
}).disableSelection();

.ttlTipBU {
  list-style-type: none;
  margin: 0;
  padding: 0 0 2.5em;
  float: left;
  margin-right: 10px;
}

.ttlTipBU li {
  margin: 0 5px 5px 5px;
  padding: 5px;
  font-size: 1.2em;
  width: 120px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>


<ul id="sortable1" class="ttlTipBU">
  <li class="ui-state-default">Item 1</li>
  <li class="ui-state-default">Item 2</li>
  <li class="ui-state-default">Item 3</li>
  <li class="ui-state-default">Item 4</li>
  <li class="ui-state-default">Item 5</li>
</ul>

<ul id="sortable2" class="ttlTipBU">
  <li class="ui-state-highlight">Item 1</li>
  <li class="ui-state-highlight">Item 2</li>
  <li class="ui-state-highlight">Item 3</li>
  <li class="ui-state-highlight">Item 4</li>
  <li class="ui-state-highlight">Item 5</li>
</ul>

赞(0）回复(0）举报 2023-03-07

我来回答

jquery 获取删除区域ID

1条答案

相关问题

热门标签

最新问答