时间戳

首页 > 解决方案 > 获取jQuery UI中拖放元素的自定义HTML属性

jquery - 获取jQuery UI中拖放元素的自定义HTML属性

问题描述

我正在构建一个纸牌游戏，其中每张纸牌（每个带有 class card的 div ）都是可拖动的。默认情况下，这些卡片可以放在所有其他卡片上，但我使用接受选项来计算卡片在被丢弃后是否应该被接受或恢复。一张卡片只能放在另一张价值比拖动卡片高 1 的卡片上。例如，7 只能放在 8 上。卡片的值 (1-13) 存储在自定义属性data-value中。

这意味着当一张卡片掉到另一张卡片上时，我需要知道拖动的卡片data-value是否比data-value它所放置的卡片少一个。我怎样才能访问这两个data-value？

$(".card").draggable({ revert: 'invalid' });

$(".card").droppable({

  accept: function(d) {

    // Here I want to access the custom HTML attribute "data-value" of both dragged card and droppable card

  }

});

标签： jquerycustom-attributesjquery-ui-droppable

解决方案

我找到了一个解决方案，但我怀疑还有另一个更简单的解决方案。

    $(".card").droppable({     

        accept: function(d) {

            if ($(d[0]).data("value") == $(this).data("value") -1) {

                return true;

            }

        }

    });

推荐阅读