IT技术博客大学习 共学习 共进步
全部 移动开发 后端 数据库 AI 算法 安全 DevOps 前端 设计 开发者

IE6下appendChild的一个小问题。

前端技术 2010-06-12 17:46:10 累计浏览 3,334 次
本机暂存

    项目中遇到一个小问题,但严重影响了用户体验。

    我们先看一个例子:

    http://www.cssrain.cn/demo/dialog_jQuery_ui/modal_looseState.html

    这是我们项目中采用的jquery ui dialog 做的页面,我把他提取出来,简化一下。

    例子中,点击add按钮弹出遮罩层,层中有2个文本框和2个多选框。

    现在我们开始测试这个问题:

    首先,我们在文本框上输入文本,把多选框也选中。然后点击窗口关闭。

    接下来,我们再点击add按钮,重新打开层。

    在ie7下,发现刚才所填写的,所选中的一切正常。

    在ie6下,文本框的内容还存在,但多选框的选中已经丢失。

    接下来为了找出原因,我看了下jquery的源码,然后发现jquery使用了appendChild这个方法,

    于是我写了个简单的例子来验证是不是它引起的:

    http://www.cssrain.cn/demo/dialog_jQuery_ui/b.html

    经验证,果真如此,ie6下多选框选中状态在点击appendChild后,丢失了。

    暂时解决办法是:

    在多选框上添加:onclick="this.defaultChecked=(!this.defaultChecked)"

    修改后的例子:

    http://www.cssrain.cn/demo/dialog_jQuery_ui/modal.html

同分类推荐文章

  1. translateZ() (2026-06-25 21:18:56)
  2. translateY() (2026-06-25 21:17:56)
  3. translateX() (2026-06-25 21:16:01)

查看更多 前端 文章 →

建议继续学习

  1. JQuery实现Excel表格呈现 (累计阅读 48,349)
  2. 深入理解Javascript之执行上下文(Execution Context) (累计阅读 18,404)
  3. 从输入 URL 到页面加载完成的过程中都发生了什么事情? (累计阅读 15,933)
  4. 图片动态局部毛玻璃模糊效果的实现 (累计阅读 14,848)
  5. 天朝第二代身份证号码的验证机制 (累计阅读 14,762)
  6. HTML 5 的data-* 自定义属性 (累计阅读 14,349)
  7. 分享一个JQUERY颜色选择插件 (累计阅读 14,223)
  8. 什么是全栈工程师? (累计阅读 14,038)
  9. 快速排序(Quicksort)的Javascript实现 (累计阅读 11,735)
  10. 7 天打造前端性能监控系统 (累计阅读 11,187)