首页  »   JavaScript

jquery 列表数据上下移动,该怎么处理(2)

网友分享于:2014-06-18  浏览:15次


<i class="icon-plus newSubMenu"></i>&nbsp;<i class="icon-trash deleteMenu"></i>
<i class="icon-arrow-down arrow"></i><i class="icon-arrow-up arrow"></i>
<input class="menuKey" type="hidden" value="">
<input class="menuType" type="hidden" value="url">
<input class="clickType" type="hidden" value="view">
<ul class="nav nav-list">
<li class="subMenu-item"><span>我要咨询</span>&nbsp;&nbsp;&nbsp;&nbsp;<i class="icon-trash deleteMenu"></i>
<i class="icon-arrow-up arrow up "></i><i class="icon-arrow-down arrow down"></i>
<input class="menuKey" type="hidden" value="31">
<input class="menuType" type="hidden" value="key">
<input class="clickType" type="hidden" value="click">
</li>
<li class="subMenu-item"><span>我要投诉</span>&nbsp;&nbsp;&nbsp;&nbsp;<i class="icon-trash deleteMenu"></i>
<i class="icon-arrow-up arrow up "></i><i class="icon-arrow-down arrow down"></i>
<input class="menuKey" type="hidden" value="32">
<input class="menuType" type="hidden" value="key">
<input class="clickType" type="hidden" value="click">
</li>
<li class="subMenu-item"><span>我要帮助</span>&nbsp;&nbsp;&nbsp;&nbsp;<i class="icon-trash deleteMenu"></i>
<i class="icon-arrow-up arrow up "></i><i class="icon-arrow-down arrow down"></i>
<input class="menuKey" type="hidden" value="33">
<input class="menuType" type="hidden" value="key">
<input class="clickType" type="hidden" value="click">
</li>
</ul>
</li>
</ul>

我的JS有问题
     $(document).ready(function () {
         //上移
             $(".up").click(function () {       
                     var $li = $(this).parents("li");
                     if ($li.index() != 0) {
                         $li.prev().before($li);
                     }
                 });
            
             //下移
     
             var liLength = $(".down").length;           
             $(".down").click(function () {
                     var $li = $(this).parents("li");                  
                     if ($li.index() != liLength - 1) {                      
                         $li.next().after($li);
                     }
                 });
             });
         


------解决方案--------------------
    $(function () {
        var moveup, currentNode, refNode;
        $('i.arrow').click(function () {
            moveup = $(this).hasClass('icon-arrow-up');//上或者下
            currentNode = $(this).closest('li');//当前要移动的li节点
            refNode = currentNode[moveup ? 'prev' : 'next']();//去参考节点
上一页 2/3下一页

相关解决方案

最新解决方案