1

我的网络应用程序有一个功能，用户可以创建一个最多包含五个项目的列表。创建列表时，我们会自动在第一项之后为其命名，但用户也可以键入自定义名称。所以，你会有这样的东西：

Name: [ Item 1 ] (this is a text box)

- Item 1
- Item 2
- Item 3
- Item 4
- Item 5

我还设置了 jQuery UI 的sortable交互，以便用户可以单击并拖动以重新排列列表中的项目。现在，我想要做的是在用户完成拖动后自动重命名列表，但前提是他们没有输入自定义名称（可以通过将名称与原始名称进行比较来确定）项目并查看它们是否匹配）。

我知道它sortable提供了许多可用于运行自定义函数（如start和stop）的事件。问题是我需要在拖动发生之前和之后运行函数以便进行比较，但是（据我所知）我无法在它们之间传递数据 - 中定义的变量start不能用于stop. 那我该怎么写呢？

4

2 回答 2

0

我通过将第一项保存在全局变量中来解决这个问题start，然后使用它与当前标题进行比较stop。也许不是最好的方法，但它确实有效：

var saveFirstItem = function(first_item) {
    startFirstItem = first_item;
};

$(document).ready(function(){
    $("#list").sortable({
        start: function(event, ui){
            var first_item = $("#list li:first-child").text();
            saveFirstItem(first_item);
        },
        stop: function(event, ui){      
            var first_item = $("#list li:first-child").text();      
            var current_title = $("#title").val();

            if (current_title == startFirstItem){
                $("#title").val(first_item);
            }
        }
    });
});
于 2012-08-10T15:55:28.277 回答
0

可能不是最学术的答案，但这里有一个想法：

为什么需要启动事件？如果我理解正确，您似乎只关心将列表的第一项放在字段中，但前提是名称不是手写的。如果您将此设置为可放置的，您可能需要一个开始事件，以添加第一个删除列表名称的项目，但我想您已经有了？

var nameIsCustom=false;
$("#ul").sortable(
{
    stop: function(event,ui)
    {
        nameIsCustom = true;
        $("ul > li").each(function()
        {
            if($("#name").val() == $(this).text())
            {nameIsCustom = false;}
        });
        if(!nameIsCustom)
        {
            $("#name").val($("#ul > li:first").text());
        }
    }
});
于 2012-08-10T15:32:59.710 回答