0

我是这个论坛的新手

我从 2 周开始学习 jquery，但我相当缺乏经验。我的网站是用 asp.net mvc 构建的并使用 jquery 1.4.1

这是代码

html

...

<% foreach (var item in Model.Amici)
    {%> 
    <div id="amico_<%= item.Id %>" idAmico="<%= item.Id %>">
    <%= item.Name %>
    </div> 
    <% } %>

……

脚本


    
    $(function() {
        $("div[id^='amico_']").draggable({ revert: "valid" });
        $("#droppable").droppable({
            activeClass: "ui-state-hover",
            hoverClass: "ui-state-active",
            drop: function(event, ui) {
                var index = $(".ui-draggable").attr('idAmico');
                $(this)
                   .addClass("ui-state-highlight")
                   .find("p")
                   .html("id = " + index);
            }
        });
    });

问题是 id 属性的值始终为 1（索引变量），而 1 和 2。（红色行）我错在哪里？

非常感谢您的回复阿尔贝托

4

2 回答 2

2

这是一个可能会有所帮助的快速说明。

<% foreach (var item in Model.Amici)
{%> 
<div id="amico_" idAmico="">
    <%= item.Name %>
</div> 
<% } %>

在这个例子中，根据您的 jQuery 选择器，我认为您期望每个 div 的 id 为“amico_1”、“amico_2”等等......也许基于项目 id？在任何情况下，id 属性都必须是唯一的。

<% foreach (var item in Model.Amici)
{%> 
<div id="amico_<%= item.Id %>" idAmico="" class="drag">
    <%= item.Name %>
</div> 
<% } %>

另请注意，我在 div 中添加了一个“拖动”类。

这意味着您的选择器可以从此更新：

$("div[id^='amico_']").draggable({ revert: "valid" });

对此

$(".drag").draggable({ revert: "valid" });

我的最后一个建议是你在这条线上有一个小错误......

var index = $(".ui-draggable").attr('idAmico');

它实际上应该是

var index = $(ui.draggable).attr('idAmico');

您应该注意到有一个名为 ui 的参数被传递到您的可放置事件中。这包含当前拖动的元素。

希望这可以帮助。

于 2011-02-18T08:46:44.623 回答
0

这是因为在您的 drop 函数中，您任意拉$(".ui-draggable")取页面上与此匹配的任何类，而不是被删除对象的子对象。

从我找到的文档（http://jqueryui.com/demos/droppable/#event-drop）中，您可以访问被删除的元素ui.draggable

于 2011-02-18T08:37:50.347 回答