jquery对信息进行排序操作

来源:互联网 发布:linux shell rm rf 编辑:程序博客网 时间:2024/06/03 07:48
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>ul列表排序</title><script src="jquery-1.7.1.min.js"></script></head><style>a{ cursor:pointer;}</style><script>$(function(){    $("#list > li > a").click(function(){        if( $(this).attr("class") == 'up' ){            if( $(this).parent("li").index() == 0 ){                alert("你已经在最顶部!");                }else{                var vsort = $(this).parent("li").prev("li").attr("sort");                $(this).parent("li").prev("li").attr("sort",$(this).parent("li").attr("sort"))                var html = $(this).parent("li").prev("li");                $(this).parent("li").attr("sort",vsort);                $(this).parent("li").after(html);                //ajax请求 交换改变两个记录的排序值                    }        }else if( $(this).attr("class") == 'down' ){            if( $(this).parent("li").index() == 4 ){                alert("你已经在最底部!");                }else{                var vsort = $(this).parent("li").next("li").attr("sort");                $(this).parent("li").next("li").attr("sort",$(this).parent("li").attr("sort"))                var html = $(this).parent("li").next("li");                $(this).parent("li").attr("sort",vsort);                $(this).parent("li").before(html);                //ajax请求 交换改变两个记录的排序值                            }        }    });});</script><body><ul id="list"><li sort='1' rel="1" ><a class="up">up</a>&nbsp;<a class="down">down</a>第一条信息1</li><li sort='2' rel="2" ><a class="up">up</a>&nbsp;<a class="down">down</a>第一条信息2</li><li sort='3' rel="3" ><a class="up">up</a>&nbsp;<a class="down">down</a>第一条信息3</li><li sort='4' rel="4" ><a class="up">up</a>&nbsp;<a class="down">down</a>第一条信息4</li><li sort='5' rel="5" ><a class="up">up</a>&nbsp;<a class="down">down</a>第一条信息5</li></ul></body></html>

0 0