posts - 257, comments - 1336, trackbacks - 63, articles - 8
  博客园 :: 首页 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理

2005年7月12日

从onfocus方法看浏览器的兼容性

        在Web Application的开发测试当中，由于存在不同的访问终端——浏览器，因此需要在不同浏览器下运行应用程序，以检验应用程序在不同的浏览器下的外观及功能上是否保持一致。尽管现在的浏览器之间的兼容性已经是相当不错，但是在对Javascript的支持上就有相当大的区别。今天就在onfocus方法上碰到了钉子。具体的代码是类似这样的：
<html>
  <head>
     <script>
        function shiftFocus() {
           document.form1.list.focus();
         }
       </script>
  </head>
  <body>
     <form name="form1">
        <input type="radio" name="group" /> Name        
        <input type="radio" name="group" onfocus="shiftFocus()" /> Company 
        <select name="list">
           <option>--Please select--</option>
        </select>
     </form>
  </body>
</html>
        为了说明问题，将Javascript方法中逻辑处理省略掉了。从代码中可以看到，当焦点focus在第二个RadioButton的时候，就调用shiftFocus方法，然后在shiftFocus方法中把焦点focus在下拉框。好了，将这段代码保存在一个文件中，然后先用IE打开。因为是要测试onfocus的方法，那么很自然就会想到利用tab键来移动焦点。于是就去按tab键了，你发现什么了吗？ 焦点是没有办法落在第二个RadioButton上的。也许你会想，这不就是moveFocus方法起作用了吗？ 咋一想，似乎是对的。那好，我们就把onfocus那段去掉看看。然后，你还是发现焦点没有办法落到第二个RadioButton上。这个是第一点问题了。既然用tab键不成，那么就用鼠标来吧。先把刚刚删除的onfocus那段先恢复回去，然后再来试试看。当你点击了第二个RadioButton的时候，一个很奇怪的现象发生了，RadioButton变灰了，感觉就是被disable掉了一样。但这只是好像，因为这个RadioButton并没有disable掉，你仍然可以点击它，onfocus方法仍然被调用。这就是第二点问题了。如果你使用Netscape或者Firefox打开，则以上两个问题都不存在。
        这里只是举了一个简单的例子，还有一些更加希奇古怪的事情，都没有办法讲其描述出来。总之，整体感觉IE对于Javascript的支持是最差的，而Netscape则最好。

posted @ 2005-07-12 22:01 FantasySoft 阅读(2538) | 评论 (11) | 编辑