日期:2014-05-16 浏览次数:20421 次
1.在页面中导入js(这里<c:url会将context路径加入到整个js请求路径中)
<script type="text/javascript" src="<c:url value='/js/formOperation.js'/>"></script>
注意:这里面貌似不可以定义本页面的js,调用的时候有可能导致其它的js用不了.
2.在事件中直接调用js
<input type="submit" value=" 创建功能 " onclick="javascript:{return checkFormElement();document.createFuncsForm.submit();}">
点击submit后首先会执行带返回值的checkFormElement(),若返回值为false表单将不会被提交,否则执行document.createFuncsForm.submit()提交表单.
3.在超链接中调用js(常用的是点击删除链接时弹出确定删除对话框,用法同2)
out.write("? <a href=catServlet?action=delete&id=" + cat.getId() ??? + " onclick=\"return confirm('确定删除?');\">删除</a>");
当在弹出的对话框中选择否,链接将不会跳转,选择确定,则会跳转.
4.解决js缓存问题(请求同一个路径时将会使用缓存中的js).
<script type="text/javascript" src="<c:url value='/js/formOperation.js?time=<%new Date(); %>'/>"></script>
这里面在请求的js路径后面加上日期的查询字符串,使得每次请求的路径都不同,将不会使用缓存中的js(好像也可以在请求的jsp,action等路径做类似操作).
注意:貌似使用ajax,dwr也能解决这样的问题.
5.在js中使用国际化消息(其它java实现的动态消息也可以)
<fmt:bundle basename="messages">
alert('<fmt:message key="formcheck.isnull"><fmt:param value="功能名称"/></fmt:message>');
</fmt:bundle>
6.js实现的倒计时器(可以用于定时页面跳转)
function timer(sec){
??? var time = document.getElementById('time');
??? sec--;
??? time.innerHTML = "<b>" + sec + "</b>";
??? if(sec != 0)
??? ??? window.setTimeout('timer(' + sec + ')', 1000);
}
7.js实现的trim功能
/**trim掉数据空格及制表符等.*/
function trim(srcValue){
??? if(srcValue.length == 0){
??? ??? return "";
??? ??? }
??? //将被trim的字符集合(用字符串表示.)
??? //b表示退格符,f表示换页符.
??? var trimStr = new String(" \n\t\r\b\f");
??? var head;
??? var end;
???
??? for(head = 0; head < srcValue.length;head++){
??? ??? if(trimStr.indexOf(srcValue.charAt(head)) != -1)
??? ??? ??? continue;
??? ??? else
??? ??? ??? break;
??? }
???
??? if(head == srcValue.length){
??? ??? return "";
??? }
??? for(end = srcValue.length-1; end >= head;end--){
??? ??? if(trimStr.indexOf(srcValue.charAt(end)) != -1)
??? ??? ??? continue;
??? ??? else
??? ??? ??? break;
??? }
???
??? var v = srcValue.substring(head, end+1);
??? return v;???
}
8.表单校验(需要调用上面的trim功能)
<script type="text/javascript" >
<!--
??? //校验表单元素
??? function checkFormElement(){
??? ??? var funcDescValue = document.getElementById('funcDescId').value;
??? ??? funcDescValue = trim(funcDescValue);
??? ??? if(funcDescValue.length == 0){
??? ??? ??? alert('<fmt:message key="formcheck.isnull"><fmt:param value="功能名称"/></fmt:message>');
??? ??? ??? return false;
??? ??? }
??? ??? else
??? ??? ??? document.getElementById('funcDescId').value = funcDescValue;
??? ???
??? ???
??? ??? var menuFuncCodeValue = document.getElementById('menuFuncCode').value;
??? ??? menuFuncCodeValue = trim(menuFuncCodeValue);
??? ??? if(menuFuncCodeValue.length == 0){
??? ??? ??? alert('<fmt:message key="formcheck.isnull"><fmt:param value="功能代码"/></fmt:message>');
??? ??? ??? return false;
??? ??? }
??? ??? else
??? ??? ??? document.getElementById('menuFuncCode').value = menuFuncCodeValue;
??? ???
??? ???
??? ??? if(document.getElementById('menuParentFuncDesc').value == -1){
??? ??? ??? alert('<fmt:message key="formcheck.mustselect"><fmt:param value="父功能名称"/></fmt:message>');
??? ??? ??? return false;
??? ??? }
??? ??? ???
??? ??? var menuPageHrefValue = docum