<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title></title>

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

<script type="text/javascript">

function GetPosition(obj){

}

$(function(){

    $(".div1").click(function(event){

            event.stopPropagation();

            //var obj = $(".div1")[0];

            var obj = $(this)[0];

            var left = 0;

            var top   = 0;

            while(obj != document.body){

                left = obj.offsetLeft + left;

                top   = obj.offsetTop + top;

                obj = obj.offsetParent;

            }

            alert("Left : " + left + "\r\n" + "Top : " + top);

    });

});

</script>

<style type="text/css">

*{margin:0px;padding:0px;}

.div1{

    position:relative;

    background:#fcc;

    border-bottom:solid 1px #000;

    border-left:solid 1px #f00;

    left:200px;

}

</style>

</head>

<body>

<h3>得到当前对象在不同大小的页面中的绝对位置，及冒泡cancelBubble</h3>

<br><br><br><br>

<input type="button" value="btn" id="btn">

<div class="div1">div000

    <div class="div1">div1

    </div>

    <div class="div1">div111

    </div>

    <div class="div1">div11133

    </div>

    <div class="div1">div1114

    </div>

    <div class="div1">div1115

        <div class="div1">div111511

        </div>

        <div class="div1">div111511

        </div>

    </div>

    <div class="div1">div1116

    </div>

</div>

</body>

</html>

得到当前对象在不同大小的页面中的绝对位置，及冒泡cancelBubble的更多相关文章

  1. Java常量,变量,对象(字面量)在JVM内存中的存储位置

    Java常量,变量,对象(字面量)在JVM内存中的存储位置 2019-02-26 18:13:09 HD243608836 阅读数 540  收藏 更多 分类专栏: JAVA jvm   苦苦研究了快 ...

  2. 工作总结 返回 json 后台对象中，某一个字段设为string 整个对象转换为json 返回到页面中

    JsonRequestBehavior.AllowGet作用 若要允许 GET 请求,请将 JsonRequestBehavior 设置为 AllowGet MVC 默认 Request 方式为 Po ...

  3. javascript基础之javascript的存在形式和js代码块在页面中的存放位置

    1.存在形式 文件 如: <script src='js/jc.js'></script> 前页面 <script type='text/javascript'>a ...

  4. getBoundingClientRect方法获取元素在页面中的相对位置

    获取元素位置可以用 offset 或 getBoundingClientRect,使用 offset 因为兼容性不好,比较麻烦,offset获取位置会形成"回溯".而 getBou ...

  5. js基础之javascript的存在形式和js代码块在页面中的存放位置和 CSS 对比

    1.存在形式 文件 如: <script src='js/jc.js'></script> 前页面 <script type='text/javascript'>a ...

  6. JavaScript脚本在页面中放置的位置

    JavaScript脚本通常放置在三个位置: 1.head部分JavaScript脚本. 2.body部分JavaScript脚本. 3.单独以.js结尾的文件中的JavaScript脚本. 客户端会 ...

  7. js实现点击按钮显示某个区域 然后点击页面中任意其他位置，隐藏该区域

    $(".licat-header-list").on("click",function(e){ $(this).addClass("active&qu ...

  8. C# Eval在aspx页面中的用法及作用

    Eval( " ")和Bind( " ") 这两种一个单向绑定,一个双向绑定,bind是双向绑定,但需数据源支持 ASP.NET 2.0改善了模板中的数据绑定操 ...

  9. MVC中 _ViewStart _Layout Index三个页面中的加载顺序

    MVC学习中忽然想到一个问题.. 在访问一个Index.cshtml页面时, MVC的加载顺序是怎么样的呢? 首先说下我的结论 . _ViewStart.cshtml . Index.cshtml . ...

随机推荐

  1. MySQL主从数据库配置

    使用工具 MySQL数据版本:5.6.36-log. 两台云服务器(Linux系统) 首先,需要在Linux系统下安装MySQL,具体步骤可以参考这里,并且确保两台主机可以相互访问,可以直接ping一 ...

  2. linux下普通用户无法使用sudo命令问题

    今天在新装的linux虚拟机中使用sudo命令时,报错如下 We trust you have received the usual lecture from the local System Adm ...

  3. Linux的getrlimit与setrlimit系统调用

    转自:http://www.cnblogs.com/niocai/archive/2012/04/01/2428128.html 功能描述:获取或设定资源使用限制.每种资源都有相关的软硬限制,软限制是 ...

  4. 转-java编译时error: illegal character '\ufeff' 的解决办法-https://blog.csdn.net/t518vs20s/article/details/80833061

    原文链接:https://blog.csdn.net/shixing_11/article/details/6976900 最近开发人员通过SVN提交了xxx.java文件,因发布时该包有问题需要回退 ...

  5. MySQL Transaction--RC和RR区别

    在MySQL中,事务隔离级别RC(read commit)和RR(repeatable read)两种事务隔离级别基于多版本并发控制MVCC(multi-version concurrency con ...

  6. sql 语句执行顺序

    一.sql语句的执行步骤: 1)语法分析,分析语句的语法是否符合规范,衡量语句中各表达式的意义. 2) 语义分析,检查语句中涉及的所有数据库对象是否存在,且用户有相应的权限. 3)视图转换,将涉及视图 ...

  7. win7上搭建Android环境及调试

    工欲善其事必先利其器,好记性不如烂笔头.要学习一门新的语言,首先必须得先搭环境,否则没法实践.如果之前按照网上的提示,搭建过环境,而且环境比较复杂的话,我相信隔很长一段时间后,就会忘记,到真正用的时候 ...

  8. Angular 4 路由时传递数据

    路由时传递数据的方式有 1. 在查询参数中传递数据 2. 在路由路径中传递参数 3. 在路由配置中传递参数 一.在查询参数中传递数据 在前一节的基础上,我们增加路由数据传递 2. 接收参数的地方 3. ...

  9. HttpPostedFile类

    在研究HttpRequest的时候,搞文件上传的时候,经常碰到返回HttpPostedFile对象的情况,这个对象才是真正包含文件内容的东西. 经常要获取的最重要的内容是FileName属性与Sava ...

  10. c# 模拟POST上传文件到服务器

    using System; using System.Collections; using System.Collections.Generic; using System.Linq; using S ...