A JavaScript Fancier

伟大的javascript技术研究中...

  IT博客 :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理 ::
  304 随笔 :: 0 文章 :: 479 评论 :: 0 Trackbacks


在Ext中,几乎所有的组件都有isVisible()方法和hidden属性,都是用来判断是否组件元素是否可见,这在ext内部管理来说没有问题,但有时我们把组件放在了自己的html结构内,如果我们把自己编写的html元素通过css定义为隐藏后,使用ext的isVisible方法和hidden属性就不能正确获取到组件是否可见了,因为ext也仅仅是根据判断元素的visibility和display属性来确定元素是否可见的。因此如果本身没有设定隐藏而外层设定了隐藏,则不能通过这两个css属性来判断元素是否可见了。

在实际的应用中,有时还必须需要知道元素的真实的可见性,但此时通过ext的内部方法就不管用了,思考测试许久突然想起了一个元素,当元素不可见时读取其实际高度或宽度则可能返回0,测试发现果然如此。
通过读取其offsetXXX或clientXXX来判断,或者使用Ext的getSize或getComputedWidth/Height方法获取,如果元素在页面不可见则会返回0,根据这点我们就可以获取到元素的真正可见性了。

如我们需要在元素可见时执行一些操作,则可以如下组织代码:
var timer=setInterval(function(){
    
if(el.getComputedHeight()>0||el.getComputedWidth()>0){
            
//do something
            clearInterval(timer);
    }
},
1)
posted on 2008-06-23 13:37 Yemoo'S JS Blog 阅读(7223) 评论(3)  编辑 收藏 引用 所属分类: javascript技巧总结Js框架组件

评论

# re: 判断html元素是否真正可见的巧妙方法 2008-06-28 11:21 长江三峡

不错  回复  更多评论
  

# re: 判断html元素是否真正可见的巧妙方法 2011-11-12 16:29 fantasy
如果元素的寛高设置为了百分比会是什么情况?  回复  更多评论
  

只有注册用户登录后才能发表评论。