分享下使用jquery遇到的怪现象

Augus6 2013-09-05 08:24:02
项目中遇到一个怪现象,公司大牛也没有注意过此问题,而且他们也很少做前端,所以没人解释得清原理。
SSH2框架下开发的项目,jsp页面中使用jQuery遇到的问题。
开发环境:
服务器tomcat,操作系统linux,jQuery版本1.8.0,IE版本9.0。
现象描述:
$(document).ready(function(){javascript逻辑代码});

jsp页面“初次”加载之后,在以上的“javascript逻辑代码”部分获取表单中的value(例:$("#id").val())得到undefined,绑定click事件(例:$("#id").click(function(){}))也得不到执行。
之所以上面用到“初次”两个字,是因为出现上述现象之后F5刷新页面,以上问题就都不见了。
我的页面是用来展示数据的,有个下一页按钮。“初次”加载页面之后,下一页按钮无功能,因为它是通过在$(document).ready(function(){})之中绑定click事件实现的。而刷新页面之后,下一页就有功能了。
发现此问题之后放弃了在$(document).ready(function(){})之中绑定事件,而是在html标签上通过onclick事件绑定函数,然后在<script></script>中定义函数来实现。在<script></script>中使用jQuery的各种功能都正常。

几点说明:
①以上异常只在IE下出现,火狐、谷歌浏览器下一点问题都没有。
②我在本地的window机器上开发完项目发布到linux系统下,在本机上也没问题,发布之后就有问题。
③无论在本机还是linux系统下,火狐、谷歌打开网页都比IE快得多。火狐、谷歌下从头到尾都是正常的。IE下一开始加载不上页面,后来去掉了$(document).ready(function(){})之后,总算功能都能实现了,但是速度上还是有很明显的差距。

各位看官尽情吐槽吧!
...全文
142 9 打赏 收藏 转发到动态 举报
写回复
用AI写文章
9 条回复
切换为时间正序
请发表友善的回复…
发表回复
clark_kidd 2013-09-06
  • 打赏
  • 举报
回复
看上去挺奇怪,这个问题不应该猜测,而应该进行调试。 你检查一下 ready 的时候,DOM 对象是否已经存在了,用 ie9 的开发人员工具(断点设在【javascript逻辑代码】的第一行),监视变量 document.getElementById("id")
q107770540 2013-09-06
  • 打赏
  • 举报
回复
引用 4 楼 Augus6 的回复:
[quote=引用 1 楼 net_lover 的回复:] 把这些代码放到页面的最后
明天到公司试试,不过感觉可能性不大![/quote] 老孟说的是有道理的
Augus6 2013-09-06
  • 打赏
  • 举报
回复
引用 7 楼 q107770540 的回复:
[quote=引用 4 楼 Augus6 的回复:] [quote=引用 1 楼 net_lover 的回复:] 把这些代码放到页面的最后
明天到公司试试,不过感觉可能性不大![/quote] 老孟说的是有道理的[/quote] 实验证明没什么效果啊。<script></script>中的代码是按照文档顺序加载的,而$(document).ready(function(){})中的代码是在文档全部加载完成之后执行的,所以代码放在哪个位置应该没什么关系。 我怀疑ie在解析js(或者说jQuery)的时候可能在某些情况下存在bug。我做了另一个有趣的验证,我的$(document).ready(function(){})中大概有不到100行代码,如上所说jsp加载的时候解析这部分代码会非常之慢,甚至卡住不往下执行。我在代码的开始加上alert(123),并且在代码中每隔二三十行加上一个alert(123),这样jQuery代码居然能够流畅的执行下来。可见alert在某种程度上起到了引导js文件解析的作用。感觉很神奇。
Augus6 2013-09-05
  • 打赏
  • 举报
回复
引用 3 楼 jikeytang 的回复:
查看你的dtd是否正常,有这一堆: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 或 <!DOCTYPE html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 这是我页面上的
Augus6 2013-09-05
  • 打赏
  • 举报
回复
引用 2 楼 xxhhbb1538 的回复:
ie解析js的效率确实慢,感觉是不是你的js逻辑太复杂了,ie像蜗牛一般在你后面跟不上你的脚步。。。。
说实话我是个新手,代码逻辑非常之简单。
Augus6 2013-09-05
  • 打赏
  • 举报
回复
引用 1 楼 net_lover 的回复:
把这些代码放到页面的最后
明天到公司试试,不过感觉可能性不大!
豪情 2013-09-05
  • 打赏
  • 举报
回复
查看你的dtd是否正常,有这一堆: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 或 <!DOCTYPE html>
  • 打赏
  • 举报
回复
ie解析js的效率确实慢,感觉是不是你的js逻辑太复杂了,ie像蜗牛一般在你后面跟不上你的脚步。。。。
孟子E章 2013-09-05
  • 打赏
  • 举报
回复
把这些代码放到页面的最后

87,904

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧