IE8下的Input输入框不能输入、全选,光标在框外,而且又粗又大是怎么一回事?

2013-07-13 16:41:46 +08:00
 Niphor
今天测试童鞋说代码里面输入框不能用了。
我以为是js问题,看了一下,我和小朋友们都惊呆了...

问题的出现很随机,我点了N久好不容易出现了
代码的流程主要是ajax获取 编辑界面html,然后用个dialog插件显示html内容。
对话框生成时 童鞋用了 xheditor和swfupload (其一或者两者)
架子大体是 seajs jquery jqueryUI构成的...

先给看2张图:

这张图是当Bug产生时,用js代码删除所有页面元素,并动态插入一个“<input />”,赋值之后的样子

当中那个 黑色矩形 我感觉是光标(下面我就简称它是 cursor了),因为它一闪一闪,而且不是页面元素,它一直在全屏时的页面底部,并不会因为浏览器窗口大小改变而变化位置,也就说你缩小浏览器高度就看不见它了...

这是在Input上右键的菜单

似乎“全选”可以选择,但是没有任何效果。


默认时 cursor是不会出现的,我右键选了全选,然后左键试图拖拉选择文本框内的文字时,试了几次才出现的...

因为是新插入的input,原则上是没有任何自定义事件的...

而问题产生时 textarea也会无法输入,但是它能右键全选,并且全选一次后点击一下里面空白处,光标就出现了,并且整个页面的input和textarea都痊愈了...




我觉得这更像是IE的Bug而不是Js导致的
我Google了一番,没见到有用的信息

有童鞋见过类似问题没?
THX.
5926 次点击
所在节点    程序员
10 条回复
Niphor
2013-07-15 08:17:00 +08:00
果然太奇葩了么...
loethen
2013-07-15 16:55:57 +08:00
粗大,霸气,围观。
ijse
2013-07-15 17:43:32 +08:00
试试在Chrome下?
liveme
2013-07-15 20:04:09 +08:00
哪里弄错了吧,改一下input字体的颜色,看那坨cursor会不会跟着改变颜色。
Niphor
2013-07-16 20:10:12 +08:00
@ijse
Chrome下应该没有,也就XP下的IE8这样 <8的不考虑了也就没测

@liveme
应该不会变,因为之前页面上也有些许样式,不过都无法对它产生影响...
Hyperion
2013-07-16 20:53:05 +08:00
不给实际代码很难想象啊... 而且描述的也不是很清楚...
liveme
2013-07-17 15:50:44 +08:00
@Niphor 如果赋样式后没有相应的效果的话,那应该就不会是光标了吧。没看到代码,调试不了。
Niphor
2013-07-18 11:03:06 +08:00
@liveme
我也想提供TestCase,不过没找到能确定重现的方法...
(BTW 要是知道怎么样肯定重现,就能对应处理了...)

来张出现问题时 改了Color之后的图:

可以看到黑条下面所有的物体的颜色都是反色的。
甚至如果开发工具的选择框(就是那选中时的绿框)在下面,也会反色成黄的,而且只有是黑条下面那部分这样。
这里还有个奇怪的地方,如果你鼠标移到xheditor菜单栏上面,只要某个菜单有下拉菜单弹出,则input又会痊愈...

@Hyperion
抱歉了,可能我表达能力不好
给个图你,当弹出的Dialog出现时,上面的文本框会出现主帖上的问题




因为想到:
当Dialog出现时,我会查找 Dialog里面的 input 并focus第一个input,因为没有对input的类型进行判断,如果第一个是hidden的,也会focus()

做了下处理,查找text的input来focus,主帖里面的问题就基本不会出现了...

于是,单独写了个 TestCase 用来动态向一个div插入 2个input(第一个hidden,第二个是text),然后focus第一个。

不过我点到手酸都没能重现主帖的问题...OTL

IE8下面input为hidden时focus有什么bug没?

这个问题太奇葩了,我表示好蛋疼...
Hyperion
2013-07-18 18:05:37 +08:00
@Niphor 总觉得好像是在样式生效之前, 继承到了什么奇怪的属性造成错位了, 或者是插入的HTML标记有问题.

有什么其他奇怪的IE Hack在使用吗? 有内存泄漏的问题存在嘛? 没办法直接调试, 只能尝试性的猜测一下了...
Niphor
2013-07-20 13:03:44 +08:00
@Hyperion
可以看主贴,那页面在Bug发生时,
所有的link标签和style标签,div都被我干掉后,用jquery插入到body的一个单纯的input标签
所以不会有什么样式继承的问题,也没什么IE Hack。
并且可以证明 Bug是对页面上所有input生效的
而且 这个Bug是随机出现的,你可能这次点了没有,下次就有了...痊愈后又不会再出现了...

所以我认为和HTML代码 内存泄露 关系不是特别大
另外自从我 focus时,指定选择 text并且不是disable的input之后,基本不会再现这个问题了

所以我现在严重怀疑 这是focus +什么未知名的操作 导致的....

真是抱歉没能提供TestCase,因为单独写没能重现
外网上又没可直接提供的连接...

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/75655

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX