用jquerytools弄了个选项卡和日历组件,在谷歌浏览器、火狐、IE9下测试正常,用IE6、7、8打开均有错误。
- IE8提示脚本错误,页面显示不完整;
- IE7提示页面无法显示;
- IE6提示Internet Explorer cannot open the Internet site 操作已中止,页面无法打开。
于是到网上查了一下,这个错误一般是因为页面没有加载完成就调用了一个脚本程序。再查看脚本代码如下:
<script>
$(function() {
$("ul.ulTabs").tabs("div.panes > div");
});
</script>
<script>
$(":date").dateinput({ trigger: true, format: 'yyyy-mm-dd', min: -1, lang:'zh' })
$(":date").bind("onShow onHide", function() {
$(this).parent().toggleClass("active");
});
// when first date input is changed
$(":date:first").data("dateinput").change(function() {
$(":date:last").data("dateinput").setMin(this.getValue(), true);
});
</script>
果然是这个问题,页面没有加载完成,就直接触发了jQuery的事件。好了,问题找到了,新建一个js文件:
//页面加载完成后再执行
jQuery(document).ready(function() {
uiComponentLoad();
});
/**
*
* @Description:UI组件加载
* @since 1.0.0
* @Date:2012-3-26 上午9:28:19
* void
*/
function uiComponentLoad(){
loadTabs();
loadDateInput();
}
/**
* 加载tabs组件
* @Description:描述一下这个方法
* @since 1.0.0
* @Date:2012-3-26 上午9:26:50
* void
*/
function loadTabs(){
$("ul.ulTabs").tabs("div.panes > div");
}
/**
*
* @Description:加载日历控件
* @since 1.0.0
* @Date:2012-3-26 上午9:27:38
* void
*/
function loadDateInput(){
$(":date").dateinput({ trigger: true, format: 'yyyy-mm-dd', min: -1, lang:'zh' })
$(":date").bind("onShow onHide", function() {
$(this).parent().toggleClass("active");
});
// when first date input is changed
$(":date:first").data("dateinput").change(function() {
$(":date:last").data("dateinput").setMin(this.getValue(), true);
});
}
再将这个js文件引入到页面。再次测试,一切正常!
