遍歷ul中的每個li

Question

我有一個日歷。 每天都有以下結構開始。

<td>
    <ul class="calendar-tasks">
    </ul>
</td>

現在，我將ul中的任務拖到以下位置：

$(function() {
    var $tasks = $(".list-tasks"),
        $calendar = $(".calendar-tasks");
    $("li", $tasks).draggable({
        revert: false,
        helper: function (event, ui) {
            return $("<div class='task-image'><span class='icon-pushpin'></span></div>");
        },
        cursorAt: { left: 25 },
        containment: "document",
        zIndex: 500
    });
    $("li", $calendar).draggable({
        revert: false,
        helper: function (event, ui) {
            return $("<div class='task-image'><span class='icon-pushpin'></span></div>");
        },
        cursorAt: { left: 25 },
        containment: "document",
        zIndex: 500
    });
    $calendar.droppable({
        accept: ".list-tasks > li, .calendar-tasks > li",
        activeClass: "highlight-active",
        hoverClass: "highlight-hover",
        drop: function (event, ui) {
            var dropped = $(this).append(ui.draggable);
            var task = $(ui.draggable).attr("data-task"),
                classname = $(ui.draggable).attr("data-class");
            $(this).find("li").each(function() {
                if ($(this).hasClass("has-task")) {
                    // Do nothing
                } else {
                    $(this).find("li").append("<div data-task='" + task + "' class='listed-task " + classname + "'>#" + task + "</div>");
                    $(this).find("li").addClass("has-task");
                }

            });
        }
    });
    $tasks.droppable({
        accept: ".calendar-tasks > li",
        activeClass: "highlight-active2",
        hoverClass: "highlight-hover2",
        drop: function (event, ui) {
            $(this).append(ui.draggable);
        }
    });
});

每個放置都是一個<li></li>本身，其中包含一些內容。 每次下降之后，li應該獲得一個類has-task 。 我有點掙扎在自動取款機上，以使其正常工作。 一切都在以下代碼中發生：

    $calendar.droppable({
        accept: ".list-tasks > li, .calendar-tasks > li",
        activeClass: "highlight-active",
        hoverClass: "highlight-hover",
        drop: function (event, ui) {
            var dropped = $(this).append(ui.draggable);
            var task = $(ui.draggable).attr("data-task"),
                classname = $(ui.draggable).attr("data-class");
            $(this).find("li").each(function() {
                if ($(this).hasClass("has-task")) {
                    // Do nothing
                } else {
                    $(this).find("li").append("<div data-task='" + task + "' class='listed-task " + classname + "'>#" + task + "</div>");
                    $(this).find("li").addClass("has-task");
                }

            });
        }
    });

我的是，如果我通過每個迭代<li> this將受到該li 。

我究竟做錯了什么？

Answer 1

$(this).find("li").each(function() { //check what 'this' object is giving. }

基於“ this”對象，使用prev()或next()指向li對象，並照常遵循ur代碼。

Answer 2

第一個$(this).find("li").each()函數遍歷每個li元素。 再次調用$(this).find("li").each ，您所指的是在li元素的第一個列表中列出的li元素：我認為這不存在。