javaspript基础，表格排序和js拖动

表格排序

一、数组排序

例：

var arr = [3,32,5,34];

arr.sort();

alert(arr.toString()); //output “3,32,34,5”  把它做成字符串进行排序了

问题：如何实现正确的排序?

一个基本的比较函数:

function comparison_function(value1,value2){

 if (value1<value2)

     return -1

 else if (value1>value2)

     return 1

 else

    return 0

}

//说明：返回1代表升序,返回-1代表降序,返回0代表相等

var arr = [3,32,5,34];

arr.sort(comparison_function); 直接把比较函数直接传到sort里面

alert(arr.toString()); //output “3,5,32,34”

如果要降序？

function comparison_function(value1,value2){//升序排列，如果想降序，只需要返回结果颠倒

 if (value1<value2)

     return 1

 else if (value1>value2)

     return -1

 else

    return 0

}

everse()方法 数组进行反转

var arr = [3,32,5,34];

arr.sort(comparison_function);

alert(arr.toString()); //output “34,32,5,3”

arr.reverse();

alert(arr.toString()); //output “3,5,32,34”

说明：如果数组已经以一种顺序排序了，使用reverse()方法将其按照相反的顺序排序，要比再次调用sort()快得多

 

 

 

 

 

 

表格排序

<table border="1" >

#div1 {

 

background-color: red;

 

height: 100px;

 

width: 100px;

 

position: absolute;

           

}

必须是绝对定位

<script type="text/javascript">                  

            function handleMouseMove() {

            var oEvent = window.event;

                var oDiv = document.getElementById("div1");

                oDiv.style.left = oEvent.clientX;

                oDiv.style.top = oEvent.clientY;

            }

        </script>

改进核心代码：

var iDiffX=0;//定义两个偏移量

var iDiffY = 0;

function handleMouseDown() {

                var oEvent = window.event;

                var oDiv = document.getElementById("div1");

                iDiffX = oEvent.clientX - oDiv.offsetLeft;//计算鼠标相对于div的偏移量

鼠标的纵坐标位置减去div的纵坐标位置 作为偏移量

                iDiffY = oEvent.clientY - oDiv.offsetTop;

                                              document.body.attachEvent("onmousemove",handleMouseMove);

                                              document.body.attachEvent("onmouseup",handleMouseUp); }

function handleMouseMove() {

                var oEvent = window.event;

                var oDiv = document.getElementById("div1");

                oDiv.style.left = oEvent.clientX - iDiffX; 鼠标位置减去偏移量

                oDiv.style.top = oEvent.clientY - iDiffY;

                                              oDiv.style.cursor="move"            }