我有一个从数据库动态填充的无序列表。我想做的是拖放列表项以重新排序列表。理想情况下,列表项的新位置将保存到数据库中的字段中。这个我可以做。我需要帮助的是用于将列表项与另一个列表项交换的 Java 脚本代码。
下面是填充列表的代码。正如您所看到的,该页面是用 ASP 编写的。
While not rsAwards.EOF
response.write "<li>" & rsAwards("Award_Name")
%>
<a href='edit_awards.asp?Action=edit&Award_ID=<%=rsAwards("Award_ID")%>'>Edit</a>
<a class="lb" href='action_awards.asp?Action=delete&Award_ID=<%=rsAwards("Award_ID")%>'>Delete</a></li>
<%
rsAwards.MoveNext
Wend
提前致谢。
最佳答案
super 简单!! 1行代码。只需添加 jquery UI(您不必添加所有内容)和一些像这样的 javascript:
$("#DivContainingYourliElements").sortable({delay:300,items:".myListElement"});
这将使元素可以拖放排序
您只需要一个 countaining div 来调用可排序,然后将一个类(此处为 .mylistElement)添加到您想要可排序的每个 li 元素
看这个 http://jqueryui.com/sortable/
作为另一个演示,我在这里使用了它。只需使用用户名:demo 密码:demo 登录 然后点击第一项,你会看到训练路径,它是可排序的
http://knowledgecity.com/tna/tnaadmin.php
顺便说一句,“延迟”属性很重要。它指定了单击和“拖动”之间的区别。所以在我的例子中,你可以单击它们,或者如果你单击并按住 300 毫秒,那么它将进入拖动/排序模式。如果只需要排序,则将延迟设置为 1。
关于javascript - 拖动和交换列表元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19595342/