隐藏掉落的元素

本文关键字：元素 隐藏 | 更新日期: 2023-09-27 18:15:28

我有一个拖放操作，我想隐藏被拖放的图像。问题是，我有图像都有相同的class和隐藏的class滴隐藏所有的图像，包括那些尚未被丢弃。我已经尝试了$(this).Hide();，但这隐藏了可掉落的，而不是拖拽的图像。

图片代码:

 using (The_Factory.Models.The_FactoryDBContext db2 = new The_Factory.Models.The_FactoryDBContext())
                {
                    string imageSource = "";
                    av = db2.Letter_Activity.ToList().FirstOrDefault(a => a.name == qs);
                    for (int i = 0; i < 4; i++)
                    {
                        if (av != null)
                        {
                            string imageBase = Convert.ToBase64String(av.image);
                            imageSource = string.Format("data:image/gif;base64,{0}", imageBase);

                            <img src="@imageSource" class="draggable correct" id="@av.name"/>
                        }
                    }
                }

这是我的可放下

的代码
$("#droppable").droppable({
        accept: '.correct',
        drop: function (event, ui) {
            $(".correct").hide();
    });
    $("#playAgain").click(function () {
        location.reload(true);
    });
});

隐藏掉落的元素

被拖动的元素可以通过ui参数作为ui.draggable访问。

$("#droppable").droppable({
        accept: '.correct',
        drop: function (event, ui) {
            ui.draggable.hide();  // hide the element dragged...
    });
    $("#playAgain").click(function () {
        location.reload(true);
    });
});

为元素添加一个类。

$("#droppable").droppable({
        accept: '.correct',
        drop: function (event, ui) {
            $(this).addClass("dropped");
            $(".dropped").hide();
    });
    $("#playAgain").click(function () {
        location.reload(true);
    });
});

最好将。drop类隐藏在css

中
.dropped{display:none;}
相关文章：