• JS获取鼠标点击对象


    问题的提出:

    在一个用户列表中,当点击用户时候,弹出这个用户的详细信息,怎么做?当然了,如果你想弹出一个新页面,那就算求了,就不用看这个,这个时候如果弹出一个新页面,就是说会向服务器回发一次,速度就降低了撒,使用最好是直接弹出一个层,然后在这个层里面现实这个人的详细信息。而这个层你不会让人家固定在一个地方撒?对不对?好,那你就要去获取你点击的地方的X,Y坐标了,但是这样不行啊,你得指定一个地方啊,如果乱点把这个层弹出来就恼火了撒,所以,咱们就指定只能在一个按钮上点击才会弹出这个层,那么现在你就要去获取这个按钮的ID了,这样来间接的获取这个按钮的X,Y坐标,因为如果直接用ClientX与ClientY 的话,也不太美观,要求是对于一条记录,在指定位置弹出。

    我用的AJAX是ASP.NET AJAX,简单,首先简历一个层,托一个UPDATEPANEL上去,然后再整一个FORMVIEW,当然了,还是稍微美化一下哈,不然有点难看。

    顺便看看获取点击对象的ID,简单:var ID = event.srcElement.ID就可以了。

    然后再去获得这个对象的绝对坐标,怎么去获得绝对坐标?

    JS里面给我们提供的函数只有offsetTop 喝offsetLeft这样的东西,但是这个值是指定对象相对于上层控件的距离,这样得到的位置不是相对于屏幕的绝对位置

    所以我们只能循环获取,知道这个对象为最外层的对象,那才得到了对于屏幕的绝对坐标

    function   getAbsPoint(ID)   
    {   
        var   x   =   ID.offsetLeft,   y   =   ID.offsetTop;   
        while(ID==.offsetParent) 
        { 
           x   +=   ID.offsetLeft;   
           y   +=   ID.offsetTop;
        }

    这样我们就获取这个指定ID属性相对于屏幕的绝对坐标。

    还有一种方法,

    function   getAbsPoint(obj)   
    {   
       var   x,y;   
       oRect   =   obj.getBoundingClientRect();   
       x=oRect.left;   
       y=oRect.top;    
    }

    这种方法要简单些,不过有时候取得的坐标值不稳定,原因不晓得,所以我就用的第一种方法,好了

    获得了这个对象的X,Y绝对坐标后,后面定位层的位置你就晓得该囊个做了撒?

    document.getElementById("div1").style.left = x;

    当然了,这个层的position肯定是absolute,不然界面就难看了。


        alert("x:"+x+","+"y:"+y);  

    顺便整几个JS常用函数

    JS中获得窗口属性的方法 

    1。获得屏幕的分辨率: 
    screen.width 
    screen.height 

    2。获得窗口大小: 
    document.body.clientWidth 
    document.body.clientHeight 

    3。获得窗口大小(包含Border、Scroll等元素) 
    document.body.offsetWidth 
    document.body.offsetHeight  

  • 相关阅读:
    Django之权限用法
    Django之stark组件的使用和总结
    Django之stark组件2
    Wmic
    Powershell + HTA
    IFG以太网帧间隙
    python编译报错
    C# 格式化XML方法
    C#开发中常用的加密解密方法
    面试题
  • 原文地址:https://www.cnblogs.com/elleniou/p/3081142.html
Copyright © 2020-2023  润新知