浏览 3824 次
锁定老帖子 主题:什么样的Element可以mask?
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
---|---|
作者 | 正文 |
发表时间:2008-08-02
最后修改:2009-01-08
比如模式window,Ext.msg.alert时的背景。 关于基本的介绍,这儿有一篇: 丫梨的笔记本:ExtJs中关于mask()的应用说明 但是文中说“【其实蒙版效果也可完全作用于任何一个组件。通过调用Element的mask()方法即可】”是不对的。 Ext 2.0 API中 Ext.Element: mask( [String msg], [String msgCls] ) : Element Puts a mask over this element to disable user interaction. Requires core.css. This method can only be applied to elem... Puts a mask over this element to disable user interaction. Requires core.css. This method can only be applied to elements which accept child nodes. 最后一句是:此方法只能用在可以接受节点的元素上。 我一直没有明白“接受节点的元素”是什么意思。难度是dhtml定义的? 但是目前的实验情况表明: 1、body window panel是可以“接受节点的元素” 2、所有的form中的field的el不是“接受节点的元素”,调用mask(),IE会出错:该操作的目标原件无效,ff没有反应。 3、TriggerField的子类,combo,datefield等getEl().parent().mask有效(IE,ff)。 textfield的getEl().parent().mask在IE下报错,ff下有效,但是text的位置会向右偏移很多。 4、IE下,field不停的parent(),发现:第一个包含所有field的element的mask是有效的。其到整个container之间的层次的div都是有效的。 即一个element是可以mask的,则包含他的其他的element都是可以mask的。 后头看看IE报的错,打开js调试器(.net 2005/2008),看到出错代码在ext-all-debug.js的228行。 Ext.DomHelper中的(Ext v2.1) insertHtml : function(where, el, html){ ... el.insertAdjacentHTML('BeforeEnd', html);... 看了下el,tag:input,就是textfield的文本框了。 baidu下insertAdjacentHTML,发现table input tbody iframe等不支持。明天找找dhtml手册,看看还有什么东西不支持。 还是没弄清楚为什么有的element不支持mask? 目前的猜想是不能做为container的都不支持。 就是说<tag></tag>中间不能有内容的都不支持mask。 但是,什么样的支持mask呢? 声明:ITeye文章版权属于作者,受法律保护。没有作者书面许可不得转载。
推荐链接
|
|
返回顶楼 | |
发表时间:2008-08-02
通过熬夜(555...)分析el.dom.outerHTML,终于初步找到答案。
1、内部不支持appchild的元素,不能mask 2、对于div,比如一个textfield的input所在的div,insertAdjacentHTML是没有问题的,可以看到添加的class为ext-el-mask的一个div在这个div的里面,input标签的后面,但是这个用来mask的div的width竟然是0??怪不得没有反应。 Ext.get("p").mask()可以 <div id="p" style="WIDTH: 237px"> sdf </div> Ext.get("p").mask()不可以 <div id="p"> sdf </div> or <div id="p" width="100"> sdf </div> 通过一系统的调试,发现一个div(ext中的el,ct多数都是dom为div的element)可以被mask的唯一条件是必须显示的申明style="WIDTH:xxx,然后插入的用来mask的 div有相同的width。”<div width=xx”都不可以。 对于一个TriggerField,其有一个div中包含几个元素组成(一般一个text,一个img),这个div的style="WIDTH:xxx在组件被创建时已经显示的指定了。 对于一个textfield,声明时没有cls:"width:xx"或是width:xx的话,其自己对齐自己容器ct的宽度,因而没有显示的style:width,造成了这个mask的bug。 问题分析差不多了,就是在创建mask-div时的width不正确的问题。 呵呵,有时间我再看能不能加个补丁fix这个问题。 |
|
返回顶楼 | |
发表时间:2008-08-02
已经提交了bug到ext-forum
|
|
返回顶楼 | |