一直以为offset是子元素相对于父元素的距离,后来用了才知道是一个坑,只存在于定位元素中

在做li的搜索的定位的时候,为了得到li相对于ul的距离,本来也可以用li的高度相乘,但是用了offsetTop,可是用上后发现得到的值怎么都不对,最后在控制台找到他的offsetParent竟然不是ul,跑到了另外一个元素上面,

原因,offsetTop是找到元素相对于父级定位元素的距离,

解决办法:在ul上面加上定位position:relative就ok了

正常

代码:

var selectedCodes=mes.attr("value");//需要定位选中li的code
if(!!selectedCodes){
$('#'+treeIds).selectNodes(selectedCodes);
//自动移动到第一个选中项
setTimeout(function(){
console.log(selectedCodes);
//获得li的offsetTop
var ntop=$('#'+treeIds).find("li[value="+selectedCodes+"]")[0].offsetTop;
//设置ul的scrollTop
$('#'+treeIds).parent()[0].scrollTop=ntop
},300);
}

关于offsetTop的误解的更多相关文章

  1. 【原】谈谈对Objective-C中代理模式的误解

    [原]谈谈对Objective-C中代理模式的误解 本文转载请注明出处 —— polobymulberry-博客园 1. 前言 这篇文章主要是对代理模式和委托模式进行了对比,个人认为Objective ...

  2. .NET开源进行时:消除误解、努力前行(本文首发于《程序员》2015第10A期的原始版本)

    2014年11月12日,ASP.NET之父.微软云计算与企业级产品工程部执行副总裁Scott Guthrie,在Connect全球开发者在线会议上宣布,微软将开源全部.NET核心运行时,并将.NET ...

  3. 通过一个实例理解 offsetLeft,offsetTop; offsetWidth , offsetHeight

    obj.offsetTop 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的计算上侧位置,整型 obj.offsetLeft 指 obj 相对于版面或由 offsetParen ...

  4. 被误解的MVC和被神化的MVVM(转)

    转载自:http://www.infoq.com/cn/articles/rethinking-mvc-mvvm 原文作者:唐巧 被误解的 MVC MVC 的历史 MVC,全称是 Model View ...

  5. 盒子 offsetLeft、offsetTop、offsetWidth、getBoundingClientRect等属性解释

    offsetLeft 获取的是忽略 margin 当前元素距离上一级父节点(有没有设置position,有的话依据父节点,没有的话依据页面最左端这时候不管滚动条移到哪) 当前元素向左的位置 记住它会将 ...

  6. offsetTop、clientTop、scrollTop、offsetTop属性

    HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对 ...

  7. Atitit. 构造ast 语法树的总结attilax oao 1. Ast结构树形12. ast view (自是个160k的jar )22.1. 多条语句ast结构22.2. 变量定义 int b,c; 的ast结构22.3. 方法调用meth1(a=1,b=2,c=3);  的ast结构23. 误解的问题33.1. 语法书子能是个二叉树,实际上多叉树越好..33.2. 非要不个ast放到个s

    Atitit. 构造ast 语法树的总结attilax oao 1. Ast结构树形1 2. ast view (自是个160k的jar )2 2.1. 多条语句ast结构2 2.2. 变量定义 in ...

  8. 页面位置 top、postop、scrolltop、offsetTop、scrollHeight、offsetHeight、clientHe

    1.top 此属性仅仅在对象的定位(position)属性被设置时可用.否则,此属性设置会被忽略. 代码如下: <div style=" position:absolute; widt ...

  9. 关于offsetWidth,offsetHeight,offsetTop,offsetLeft和二维数组的声明

    offsetWidth,offsetHeight,offsetTop,offsetLeft 为只读状态,返回的值是int形式 只读形式即不能通过修改其值的大小. 想要修改某元素的这些值的大小(widt ...

随机推荐

  1. hdu 5067 遍历指定点集最小时间

    http://acm.hdu.edu.cn/showproblem.php?pid=5067 贴题解 由于Harry的dig machine是无限大的,而装载石头和卸载石头是不费时间的,所以问题可以转 ...

  2. 2014年誓言:干掉网页设计程序——Dreamweaver!

    2014年誓言:干掉网页设计程序——Dreamweaver! 阅读:  评论:  作者:Rybby  日期:  来源:rybby.com 2014年,我写下誓言,用自己设计的在线网页设计工具“拉拉变” ...

  3. 【PAT Advanced Level】1014. Waiting in Line (30)

    简单模拟题,注意读懂题意就行 #include <iostream> #include <queue> using namespace std; #define CUSTOME ...

  4. [转载]将json字符串转换成json对象

    例如: JSON字符串: var str1 = '{ "name": "cxh", "sex": "man" }'; J ...

  5. visual studio 2015 update 3 简体中文企业版下载地址

    文件名: cn_visual_studio_enterprise_2015_with_update_3_x86_x64_dvd_8923298.iso语言: Chinese - SimplifiedS ...

  6. 微信小程序开发教程(一)—介绍和准备

    前言: 因为客户需要,也为了更好的发展我们公司的产品,所以决定扩展移动端.但是由于公司没有原生安卓开发人员,而且开发安卓成本比较高,所以公司一致决定开发微信小程序,也是由于微信小程序最近的火热. 后台 ...

  7. 附2 volatile

    注:在阅读本章之前,先要了解Java内存模型,见上一章<附1 Java内存模型与共享变量可见性>,链接如下: http://www.cnblogs.com/java-zhao/p/5124 ...

  8. mysql数据库binlog日志的异地备份

    MySQL数据库的二进制日志binlog记录了对数据库的全量DDL和DML操作,对数据库的point to point灾难恢复起着无法替代的关键作用.因此,基于此类考虑,需要对生产环境产生的binlo ...

  9. 【UVA11107 训练指南】Life Forms【后缀数组】

    题意 输入n(n<=100)个字符串,每个字符串长度<=1000,你的任务是找出一个最长的字符串使得超过一半的字符串都包含这个字符串. 分析 训练指南上后缀数组的一道例题,据说很经典(估计 ...

  10. 前端入门CSS(2)

    参考: https://www.cnblogs.com/liwenzhou/p/7999532.html 背景属性 /*背景颜色*/background-color: red; /*背景图片*/ ba ...