1、如何每次请求web页面都取最新版本,而不是浏览器缓存中的页面 l 问题:浏览器中可以设定缓存选项来设置是否使用页面缓存,所以没法强制用户设定所有的web页面都不使用缓存。 l 解决方法:在页面的head标记中添加下面的标记,以保证该页面不缓存,每次请求
1、如何每次请求web页面都取最新版本,而不是浏览器缓存中的页面
l 问题:浏览器中可以设定缓存选项来设置是否使用页面缓存,所以没法强制用户设定所有的web页面都不使用缓存。
l 解决方法:在页面的
标记中添加下面的标记,以保证该页面不缓存,每次请求都取最新版本。
l 浏览器缓存设置是针对所有页面的,而这种设置方法是针对特定单个页面的,会覆盖浏览器缓存设置。
2、在使用window.showmodaldialog()方法打开窗口中,如何提交表单不会弹出新窗口?
l 问题:首先window.showmodaldialog()只在ie浏览器中有效。在使用window.showmodaldialog()方法打开窗口中提交表单时,ie浏览器默认情况在新窗口中显示结果页面。
l 解决方法:在页面的
标记中添加下面的标记,指定基本目标窗口为_self。这样,提交表单时,就会在当前窗口中显示结果页面。
3、双表头固定的数据列表中,滚动条同步移动的实现
l 问题:web中单表头固定的数据列表使用比较多,其滚动条移动的实现很简单,只要使用
标记,设置其的样式就可以了。但有时也需要使用双表头固定的数据列表,典型的例子就是人员的日程安排。l 解决方法:分别用三个
标记包含上表头(topheader),左表头(leftheader)和数据内容(content),只有content有滚动条;当移动滚动条时(产生onscroll事件),设置topheader的scrollleft属性以及leftheader 的scrolltop属性,使其和content保持一致。l 下面是一个实现例子的核心代码片断,做一下简单说明,源代码可以在这里下载。
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;
}
}
l 先来看三个
标记的样式:? overflow: scroll表示当
标记中的内容溢出时可以滚动? 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内部包含的
的width设置为绝对大小,并大于对应的width,以便出现水平滚动条l syncscroll()函数在onscroll事件触发时调用,使topheader的scrollleft属性以及leftheader 的scrolltop属性和content的保持同步
l 上面的例子个静态页面,在实际应用中通常是动态页面,需要注意以下一些方面:
? 显示的列数不定时(例如每个月的天数有所不同),需要动态计算
的width值? 当content内部包含的
的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
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;
};