javascript - 可在放置时放置,元素会附加两次

标签 javascript jquery jquery-ui-droppable

由于这种拖放操作,我几乎要崩溃了。我只是想在触发丢弃时发出提醒消息。

这是我的代码,我不明白为什么警报发送了两次!请帮助我,否则我很快就会住院:p

jQuery:

$(document).ready(function() {

    init();

    function init () {

        sorting();
        dragging();
        dropping();
    }

    function resize (event, ui) {
        ui.helper.find("img#day_image").css({ height: img_height, width: img_width });
        ui.helper.css({ height: img_height, width: img_width });
    }

    function sorting () {
        $("#dropbar").sortable({
            connectWith: ".deal-itinerary-list",
            revert: true,
            dropOnEmpty: false
            /*
            stop: function (event, ui) {

                $("li.placeholder").each(function(i) {

                    $(this).find("span.day-nr").text('Day ' + ++i);

                });

            }
            */
        });
    }

    function dragging () {
        $(".deal-itinerary-list li").draggable({
            connectToSortable: "#dropbar",
            helper: function (event) {
                var image = $(this).find("img#day_image").clone();
                return image;
            },
            revert: false,
            opacity: 0.5,
            cursorAt: { top: 50, left: 50},
            start: function (event, ui) {
                $(ui.helper.find(".day-content")).hide();
            },
            drag: resize
        });
    }

    function dropping() {

        $("#dropbar").droppable({
            tolerance: "pointer",
            accept: "img#day_image",
            drop: function (ui) {

                alert("hello");

            }
        });

    }

    $( "ul, li" ).disableSelection();

});

最佳答案

如果在同一元素上同时使用可排序和可放置,显然这是一个已知问题。

This questions solved my problem .

关于javascript - 可在放置时放置,元素会附加两次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31563555/

相关文章:

javascript - 附加到 React 输入组件的日期选择器

javascript - 使用 javascript 对输入类型进行格式编码

jquery - 如何使用 jQuery UI 设置按钮的颜色?

jQuery 可放置容器并不总是捕获放置事件

Jquery UI - 允许 droppable 具有可阻止的 div

javascript - 如何在动态创建的文本框中设置值

javascript - 将嵌套数组转换为对象,将数组索引与对象 ID 匹配

javascript - Jquery:当主菜单悬停在子菜单项上时,停止发生效果

javascript - Ace Editor 中 iframe 源代码输出中出现不需要的空间