1、如何每次请求Web页面都取最新版本，而不是浏览器缓存中的页面
l 问题：浏览器中可以设定缓存选项来设置是否使用页面缓存，所以没法强制用户设定所有的Web页面都不使用缓存。
l 解决方法：在页面的<HEAD>标记中添加下面的标记，以保证该页面不缓存，每次请求都取最新版本。
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache,must-revalidate">
l 浏览器缓存设置是针对所有页面的，而这种设置方法是针对特定单个页面的，会覆盖浏览器缓存设置。
2、在使用window.showModalDialog()方法打开窗口中，如何提交表单不会弹出新窗口？
l 问题：首先window.showModalDialog()只在IE浏览器中有效。在使用window.showModalDialog()方法打开窗口中提交表单时，IE浏览器默认情况在新窗口中显示结果页面。
l 解决方法：在页面的<HEAD>标记中添加下面的标记，指定基本目标窗口为_self。这样，提交表单时，就会在当前窗口中显示结果页面。
<base target="_self">
3、双表头固定的数据列表中，滚动条同步移动的实现
l 问题：Web中单表头固定的数据列表使用比较多，其滚动条移动的实现很简单，只要使用<DIV>标记，设置其的样式就可以了。但有时也需要使用双表头固定的数据列表，典型的例子就是人员的日程安排。
l 解决方法：分别用三个<DIV>标记包含上表头（topheader），左表头（leftheader）和数据内容（content），只有content有滚动条；当移动滚动条时（产生onscroll事件），设置topheader的scrollLeft属性以及leftheader 的scrollTop属性，使其和content保持一致。
l 下面是一个实现例子的核心代码片断，做一下简单说明，源代码可以在这里下载。
<style TYPE="text/css">
<!--
div.topheader {
width: 840px;
height: 30px;
margin-top: 0;
margin-bottom: 0;
margin-left: 0;
overflow: scroll;
overflow-x: hidden;
overflow-y: hidden;
}
div.leftheader {
width: 120px;
height: 422px;
margin-top: 0;
margin-bottom: 0;
overflow: scroll;
overflow-x: hidden;
overflow-y: hidden;
word-break: break-all
}
div.content {
width: 856px;
height: 439px;
margin-top: 0;
margin-bottom: 0;
margin-left: 0;
overflow: scroll;
overflow-x: auto;
overflow-y: auto;
word-break: break-all
}
table.topheader {
width: 2520;
}
th.t1 {
width: 78;
height: 24;
}
table.leftheader {
width: 120;
}
td.l1 {
width: 120;
height: 70;
}
table.content {
width: 2520;
}
td.c1 {
width: 84;
height: 70;
}
-->
</style>
<script type="text/javascript">
function hasAttribute(object, attrName) {
if (typeof object !== "object" && typeof object !== "string") {
return false;
}
return attrName in object;
}
function syncScroll(topId, leftId, contentId) {
var topHeader = document.getElementById(topId);
var leftHeader = document.getElementById(leftId);
var content = document.getElementById(contentId);
if (topHeader && hasAttribute(topHeader, 'scrollLeft') && content && hasAttribute(content, 'scrollLeft')) {
topHeader.scrollLeft=content.scrollLeft;
}
if (leftHeader && hasAttribute(leftHeader, 'scrollTop') && content && hasAttribute(content, 'scrollTop')) {
leftHeader.scrollTop=content.scrollTop;
}
}
</script>
l 先来看三个<DIV>标记的样式：
Ø overflow: scroll表示当<DIV>标记中的内容溢出时可以滚动
Ø topheader和leftheader的overflow-x及overflow-y属性设置为hidden，表示溢出时不显示滚动条，而content设置为auto
Ø content的width值比topheader的大16px，而height值比leftheader的大17px；这是为滚动条预留的（滚动条大概16-17px，根据具体 情况微调）
Ø word-break: break-all用来保证数据过长时自动换行，以免将单元格宽度撑大而错位
l topheader和content内部包含的<TABLE>的width设置为绝对大小，并大于对应<DIV>的width，以便出现水平滚动条
l syncScroll()函数在onscroll事件触发时调用，使topheader的scrollLeft属性以及leftheader 的scrollTop属性和content的保持同步
l 上面的例子个静态页面，在实际应用中通常是动态页面，需要注意以下一些方面：
Ø 显示的列数不定时（例如每个月的天数有所不同），需要动态计算<TABLE>的width值
Ø 当content内部包含的<TABLE>的width值<=topheader的width值（不出水平滚动条）时，content的width值要去掉滚动条大小值
Ø 同样，当content内部包含的<TABLE>的height值<= leftheader的width值（不出垂直滚动条）时，content的height值要去掉滚动条大小值
Ø word-break: break-all保证了单元格宽度不会撑大；但当单元格内容显示不下时，会自动撑大宽度，所以当表格的行距不同时，要动态计算以决定是否要出垂直滚动条，这个要麻烦一些
4、全角半角字符混合输入的处理
l 问题1：输入长度的验证，例如输入内容在数据库中是40字节，所以输入长度不能超过40字节；而JavaScript中的String.length获得的是字符个数。
l 解决方法：通常全角字符为2字节，而半角字符为1字节；这样String.length获得的长度相当于将全角字符作为1字节处理，所以再加上全角字符的个数就是字节数。考虑到escape()函数处理的字符串中，全角字符都转换成%uXXXX的Unicode形式，可以由此统计出字符串中的全角字符个数。
l 下面的JavaScript代码扩展了String对象，用来获取字符串的字节数
String.prototype.getBytesLength = function () {
return this.length + (escape(this).split("%u").length - 1);
};
l 问题2：由于显示空间有限，要求显示内容按指定长度（字节数）截取，这里有全角字符的前一个字节在指定长度范围里的问题。
l 解决方法：从字符串后端开始，逐个删除字符，直到字符串字节数<=指定长度字节数。
l 下面的JavaScript代码扩展了String对象，实现了上面的截取方法
String.prototype.removeCharAt = function (index) {
var retStr = this;
if (index <= this.length) {
if (index === 0) {
retStr = this.substring(1);
} else {
if (index == this.length - 1) {
retStr = this.substring(0, this.length - 1);
} else {
retStr = this.substring(0, index) + this.substring(index + 1);
}
}
}
return retStr;
};
String.prototype.intercept = function (length) {
var s = this;
var len = s.getBytesLength();
while (len > length) {
s = s.removeCharAt(s.length - 1);
len = s.getBytesLength();
}
return s;
};