js获取鼠标坐标，设置div的高度、位置、内容等，及注意要点

后台：GridView控件的方法

protected void ShowGrid_OnRowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            //string str1,.........
                e.Row.Cells[2].Attributes.Add("onmouseover", "mouseOverTip('" + str1+ "','" + str2+ "','" + "......"+ "')");
                e.Row.Cells[2].Attributes.Add("onmouseout", "mouseOutTip()");
                //e.Row.Cells[2].Attributes.Add("onmousemove", "mousemoveTip('" + str1+ "','" + str2+ "','" + "......"+ "',event)");
                e.Row.Cells[2].Attributes.Add("onmousemove", "mousemoveTip2(event)");
        }
    

        if (e.Row.RowType == DataControlRowType.DataRow)//-1 != e.Row.RowIndex
        {
            //鼠标经过时，行背景色变
        e.Row.Attributes.Add("onmouseover", "this.style.backgroundColor='#00A9FF'");
           Button1.Text = e.Row.RowIndex.ToString(); Forecast_DataBind(((Label)(e.Row.Cells[0].Controls[1])).Text.ToString().Trim());
            //鼠标移出时，行背景色变
        e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor='#FFFFFF'");
        }
    }

 前台：javascript部分

<script type="text/javascript" >
        function mouseOverTip(str1,str2,....) {
            var div1 = document.getElementById("tipdiv");
            div1.style.display = "block";
            document.getElementById("gnamediv").innerHTML = "站名：" + str1;
            document.getElementById("wstatusdiv").innerHTML = "天气现象：" + str2;
            //......            
        }
        function mouseOutTip() {
            var div1 = document.getElementById("tipdiv");
            div1.style.display = "none";
        }
        function mousemoveTip(str1,str2,.....,event) {
            var div1 = document.getElementById("tipdiv");
            div1.style.display = "block";
            document.getElementById("gnamediv").innerHTML = "名称：" + str1;
            document.getElementById("wstatusdiv").innerHTML = "天气：" + str2;
            //......
            var x, y;
            var e = e || event;
            x = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft + 20;
            y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
            div1.style.position = "absolute";
            div1.style.top = y + "px";
            div1.style.left = x + "px";
        }
        function mousemoveTip2(event) {
            var div1 = document.getElementById("tipdiv");
            var x, y;
            var e = e || event;
            x = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft + 20;
            y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
            div1.style.position = "absolute";
            div1.style.top = y + "px";
            div1.style.left = x + "px";
        }
    </script>

 实现功能：当鼠标悬停在、离开、移动于gridview第2列上时，展现细节内容的div层或显示、或隐藏、或移动。

注意要点（易出问题的地方）：1、div1.style.display = "block";   "block"需要加引号。

2、div1.style.position = "absolute";  这一句是需要的。

3、div1.style.left = x + "px";  需要加上"px"。如果缺少，只能在搜狗浏览器上正常运行，起作用；在IE、FireFox、360浏览器上，div的位置将是固定不随鼠标动的。

4、var e = e || event;  这里应该是event，不应该是window.event。如果写成window.event，在FireFox上不兼容。