分类目录归档:WebDev

IE6提交表单到动态添加的iframe

最近做无刷新上传,传统方法是提交到隐藏的iframe里然后回调
不希望所有上传的页面都预设iframe,于是采用动态创建的方式(无视掉里面的jQuery吧):

结果IE6下总是提交到一个新窗口
解决办法是不采用DOM操作,而是直接使用innerHTML:

参考文章:http://forums.digitalpoint.com/showthread.php?t=107314

IE8回车提交表单的bug

这回中枪的不是IE6了,更悲剧

问题发生的条件:

表单所在容器载入时是display:none,且表单内包含超过一个的文本框
这时候在表单内按回车就无法触发表单的submit事件(只有一个文本框时正常)

如果载入时是display:none的以后再怎么显示也没有用了

解决办法:

  • 载入DOM完毕后再隐藏元素
    这个应该是根本解决办法,但是实际操作起来很麻烦。
    首先用户可能看到不期望的显示内容闪烁,然后在一些场合下先显示会导致JS计算占位出问题(例如很多带Overlay的弹出层显示实现)
  • 强制绑定keydown事件
    判断浏览器的版本,根据需要强制绑定回车键按下的事件处理
  • 不处理
    这是我目前的处理方法,不纵容M$,哈哈

同样的bug还存在于目前最新版本的IE9测试版本中
不得不说IE真是一个奇葩,还是系列的

参考文章:
http://stackoverflow.com/questions/1427912/in-ie8-enter-key-in-a-form-does-not-work
http://stackoverflow.com/questions/964734/hitting-enter-does-not-post-form-in-ie8

[温故而知新]再谈IE中li之间高度空隙的问题

时隔两年之后,再次碰到IE6、IE7下li高度占用的bug,2008年的文章在这里

之前的老办法还是能解决问题的,然后顺便研究了一下。

首先是症状的发生条件:

  • 1、IE6、IE7
  • 2、li内嵌其他容器,不仅限于超链接,我测试过span等也有此问题
  • 3、高度低于某个值,这个值我没有严格测试过,但是我把li的高度设置成30px的时候没问题,18px的时候就有问题

问题解决办法:

  • 1、给li附加样式

    li.classname {
    float: left;
    width: 100%;
    }
  • 2、将li设置成inline,给内嵌容器设置宽度

    li.classname {
    height: 18px;
    line-height: 18px;
    display:inline;
    }
    li.classname a {
    display: block;
    width: 100%;
    }

CSS Sprites样式生成工具

推荐一个CSS Sprites样式生成工具
作者主页:http://www.cssforest.org/blog/index.php?id=129

这是一个基于Adobe AIR的工具,需要下载AIR运行时

使用效果图:
css_sprite

操作说明:
载入图片后,双击新增一个区域,设置每个区域的类名等属性,最后可以导出css列表
更多说明可以参考主页内容