javaWeb常用代码集锦.doc

1. 键盘回车键作确认键使用12获取url中的参数23登录验证代码24operamasks中omGrid右键菜单35java时间格式转化46sql语句拼接47解决js传递url到服务器中文乱码4获取表单所有值5返回结果字符串中含有换行符的操作5判断是否是iE6、7、86修改jquery的默认编码（默认UTF-8改成改GB2312）6解决jQuery, prototype共存，$全局变量冲突问题6jQuery 判断元素上是否绑定了事件6jQuery如何正确地使用toggleClass6jQuery如何验证某个元素是否为空7jquery如何从一个未排序的集合中找出某个元素的索引号7jquery如何把函数绑定到事件上7jquery在创建元素时，如何使用对象字面量（literal）来定义属性7jquery如何使用多个属性来进行过滤7如何使用jQuery来预加载图像7如何为任何与选择器相匹配的元素设置事件处理程序8如何找到一个已经被选中的option元素8如何隐藏一个包含了某个值文本的元素：8jquery如何检测各种浏览器8如何使用jQuery来检测右键和左键的鼠标单击两种情况8如何在jQuery中克隆一个元素9在jQuery中如何测试某个元素是否可见9如何把一个元素放在屏幕的中心位置9在jQuery中如何使用.siblings()来选择同辈元素9jquery如何扩展String对象的方法9js 获取浏览器高度和宽度值(多浏览器)11DOCTYPE声明对JS获取窗口宽度和高度的影响14JS获取浏览器窗口巨细 获取屏幕，浏览器，网页高度宽度14HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth14Css命名规范15Java上传文件代码171. 键盘回车键作确认键使用function pass(event) var event = event | window.event; var curkey = event.keyCode; if (curkey = 13) 执行的函数或语句。 document.onkeydown=function(event) pass(event);2获取url中的参数function getParameter(param) var query = window.location.search;/获取URL地址中？后的所有字符 var iLen = param.length; var iStart = query.indexOf(param);/获取该参数名称的其实索引 if (iStart = -1)/-1为没有该参数 return ; iStart += iLen + 1; var iEnd = query.indexOf(&, iStart);/获取第二个参数的其实索引 if (iEnd = -1)/只有一个参数 return query.substring(iStart);/获取单个参数的参数值 return query.substring(iStart, iEnd);/获取第二个参数的值 3登录验证代码function login() var username; var password; username = document.getElementById(username).value; password = document.getElementById(password).value; if (username = null | username = ) alert(用户名不能为空); return; if (password = null | password = ) alert(密码不能为空); return; /jquery的ajax方法 $.post(LoginServlet?d=+Math.random(), username : username, password : password , function(responseText) if (responseText = success) window.location.href = index.html? + username; return; document.getElementById(password).value=; alert(用户名或密码错误，请重新输入); ); 4operamasks中omGrid右键菜单初始化单击事件，考虑到不同浏览器的情况：function click(el) try if(el.click) el.click(); else var evObj = document.createEvent(HTMLEvents); evObj.initEvent(click,true,false); el.dispatchEvent(evObj); catch(e) alert(e); ;添加右键菜单和创建右键菜单点击事件：$(#rightMenu).omMenu( contextMenu:true, minWidth:50, maxWidth:100, dataSource:id:down_dat,label:下载DAT文件,url:,seperator:false, id:down_dxt,label:下载DXT文件,url:,seperator:false, id:info,label:记录详细信息,url:,seperator:false, id:intograph,label:进入视图,url:,seperator:false , onSelect:function(item,event) if(item.id = down_dat) downdat(); else if(item.id = down_dxt) downdxt(); else if(item.id = info) showDialog(详细信息,rowData_); );绑定表格右键事件：$(#grid).bind(contextmenu,function(e) fileIndex = -1;/这里fileIndex会在单击事件中设置当前选择的信息 click(e.target); if(fileIndex != -1) $(#rightMenu).omMenu(show,e); ;);5java时间格式转化SimpleDateFormat sdf = new SimpleDateFormat(yyyy-MM-dd HH:mm:ss);String logintime = sdf.format(new Date();6sql语句拼接String sql = select * from App_User Where UserName Like ?;String UserName = xml;Connection conn = DBUtil.getConnection();PreparedStatement ps = conn.prepareStatement(sql);ps.setString(1,% + UserName + %);ResultSet rs = ps.executeQuery();注意：ps.setString(1,% + UserName + %); 中没有原先的单引号，这个一定要记住。7解决js传递url到服务器中文乱码js代码：function ajaxServProcess(prValue) var url=batchWorkSheet.do; var name = encodeURIComponent(encodeURIComponent(prValue); /注意这里要转两次编码 var pars=act=select&parentValue=+name; new Ajax.Request(url,method:get,parameters:pars,onComplete:ajaxCallBackAttrScriptType); 服务端代码： /* * 根据页面的传过来的ajax调用，返回相应的数据 */ public ActionForward select(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws Exception response.setContentType(text/html; charset=GBK); response.addHeader(Cache-Control, no-cache,must-revalidate); response.addHeader(Pragma, no-cache); String parentValue = request.getParameter(parentValue); parentValue = URLDecoder.decode(parentValue,UTF-8); String result = ; if (parentValue != null) & (!parentValue.trim().equals() result = WebSupportHelper.getProcessNodeLabelValueStr(parentValue); response.getOutputStream().write(result.getBytes(); return null; 解决方法二：url = ./getNodeDetail?d=+Math.random()+&nodeName=+ encodeURI(point.nodeName);nodeName = new String(nodeName.getBytes(ISO_8859_1),utf-8);获取表单所有值function getData(formName) var result = ;$(#+formName+ input).each(function() var id = , val = ;id = $(this).attr(id);if (id = undefined | id = null | id = ) return;if ($(this).hasClass(combobox-f) val = $(this).combobox(getValue); else if ($(this).hasClass(datebox-f) val = $(this).datebox(getValue); else val = $(this).val();result = result + id + = + val + &;);result = result + action_add= + $(#action_add).text() + &acln1_add=+ $(#acln1_add).text() + &acln2_add= + $(#acln2_add).text();return result;返回结果字符串中含有换行符的操作if (retMsg != null) retMsg = retMsg.replaceAll(n, n);retMsg = retMsg.replaceAll(r, r);retMsg = retMsg.replaceAll(b, b);retMsg = retMsg.replaceAll(f, f);retMsg = retMsg.replaceAll(t, t);retMsg = retMsg.replaceAll(, );Var isIE=!window.ActiveXObject; Var isIE6=isIE&!window.XMLHttpRequest; Var isIE8=isIE&!document.documentMode; Var isIE7=isIE&!isIE6&!isIE8; if(isIE) if(isIE6) alert(”ie6″); elseif(isIE8) alert(”ie8″); elseif(isIE7) alert(”ie7″); 1 if(document.all) alert(”IE浏览器”); else alert(”非IE浏览器”); /第二种更好一写if(!window.ActiveXObject) alert(”IE浏览器”); else alert(”非IE浏览器”); 判断是否是iE6、7、8修改jquery的默认编码（默认UTF-8改成改GB2312）$.ajaxSetup( ajaxSettings: contentType:application/x-www-form-urlencoded;chartset=GB2312 );解决jQuery, prototype共存，$全局变量冲突问题 jQuery.noConflict(); 注意：一定要先引入prototype.js 再引入jquery.js，先后顺序不可错。jQuery 判断元素上是否绑定了事件var $events = $(#foo).data(events);if( $events & $eventsclick )/your code jQuery如何正确地使用toggleClass/切换（toggle）类允许你根据某个类的/是否存在来添加或是删除该类。/这种情况下有些开发者使用：a.hasClass(blueButton) ? a.removeClass(blueButton) : a.addClass(blueButton);/toggleClass允许你使用下面的语句来很容易地做到这一点a.toggleClass(blueButton);jQuery如何验证某个元素是否为空/ 方法一if (! $(#keks).html() /什么都没有找到;/ 方法二if ($(#keks).is(:empty) /什么都没有找到;jquery如何从一个未排序的集合中找出某个元素的索引号$(ul li).click(function () var index = $(this).prevAll().length; /prevAll(expr): 查找当前元素之前所有的同辈元素);jquery如何把函数绑定到事件上/方法一$(#foo).click(function(event) alert(User clicked on foo.); ); /方法二, 支持动态传参$(#foo).bind(click, test1:abc, test2:123, function(event) alert(User clicked on foo. + event.data.test1 + event.data.test2 ); );jquery在创建元素时，如何使用对象字面量（literal）来定义属性var e = $(, href: #, class: a-class another-class, title: . );jquery如何使用多个属性来进行过滤/在使用许多相类似的有着不同类型的input元素时， /这种基于精确度的方法很有用 var elements = $(#someid inputtype=sometypevalue=somevalue).get();如何使用jQuery来预加载图像jQuery.preloadImages = function() for(var i = 0; i arguments.length; i+) $().attr(src, argumentsi); ; /用法 $.preloadImages(image1.gif, /path/to/image2.png, some/image3.jpg); 如何为任何与选择器相匹配的元素设置事件处理程序$(button.someClass).live(click, someFunction); /注意，在jQuery 1.4.2中，delegate和undelegate选项 /被引入代替live，因为它们提供了更好的上下文支持 /例如，就table来说，以前你会用$(table).each(function() $(td, this).live(hover, function() $(this).toggleClass(hover); ); ); /现在用 $(table).delegate(td, hover, function() $(this).toggleClass(hover); );如何找到一个已经被选中的option元素$(#someElement).find(option:selected); 如何隐藏一个包含了某个值文本的元素：$(p.value:contains(thetextvalue).hide(); jquery如何检测各种浏览器检测Safari (if( $.browser.safari), 检测IE6及之后版本 (if ($.browser.msie & $.browser.version 6 ), 检测IE6及之前版本 (if ($.browser.msie & $.browser.version = 1.8 )如何使用jQuery来检测右键和左键的鼠标单击两种情况$(#someelement).live(click, function(e) if( (!$.browser.msie & e.button = 0) | ($.browser.msie & e.button = 1) ) alert(Left Mouse Button Clicked); else if(e.button = 2) alert(Right Mouse Button Clicked); );如何在jQuery中克隆一个元素var cloned = $(#somediv).clone(); 在jQuery中如何测试某个元素是否可见if($(element).is(:visible) /该元素是可见的 如何把一个元素放在屏幕的中心位置jQuery.fn.center = function () return this.each(function()$(this).css(position:absolute,top, ( $(window).height() - this.height() ) / 2 + $(window).scrollTop() + px, left, ( $(window).width() - this.width() ) / 2 + $(window).scrollLeft() + px););/这样来使用上面的函数： $(element).center();在jQuery中如何使用.siblings()来选择同辈元素/ 不这样做 $(#nav li).click(function() $(#nav li).removeClass(active); $(this).addClass(active); );/替代做法是 $(#nav li).click(function() $(this).addClass(active).siblings().removeClass(active); );jquery如何扩展String对象的方法$.extend(Stotype, isPositiveInteger:function() return (new RegExp(/1-9d*$/).test(this); , isInteger:function() return (new RegExp(/d+$/).test(this); , isNumber: function(value, element) return (new RegExp(/-?(?:d+|d1,3(?:,d3)+)(?:.d+)?$/).test(this); , trim:function() return this.replace(/(s*)|(s*$)|r|n/g, ); , trans:function() return this.replace(/</g, ).replace(/"/g, ); , replaceAll:function(os, ns) return this.replace(new RegExp(os,gm),ns); , skipChar:function(ch) if (!this | this.length=0) return ; if (this.charAt(0)=ch) return this.substring(1).skipChar(ch); return this; , isValidPwd:function() return (new RegExp(/(_|a-zA-Z0-9)6,32$/).test(this); , isValidMail:function() return(new RegExp(/w+(-w+)|(.w+)*A-Za-z0-9+(.|-)A-Za-z0-9+)*.A-Za-z0-9+$/).test(this.trim(); , isSpaces:function() for(var i=0; i BODY对象宽度 document.body.clientHeight = BODY对象高度 document.documentElement.clientWidth = 可见区域宽度 document.documentElement.clientHeight = 可见区域高度 FireFox中： document.body.clientWidth = BODY对象宽度 document.body.clientHeight = BODY对象高度 document.documentElement.clientWidth = 可见区域宽度 document.documentElement.clientHeight = 可见区域高度 Opera中： document.body.clientWidth = 可见区域宽度 document.body.clientHeight = 可见区域高度 document.documentElement.clientWidth = 页面对象宽度（即BODY对象宽度加上Margin宽） document.documentElement.clientHeight = 页面对象高度（即BODY对象高度加上Margin高） 没有定义W3C的标准，则 IE为： document.documentElement.clientWidth = 0 document.documentElement.clientHeight = 0 FireFox为： document.documentElement.clientWidth = 页面对象宽度（即BODY对象宽度加上Margin宽) document.documentElement.clientHeight = 页面对象高度（即BODY对象高度加上Margin高） Opera为： document.documentElement.clientWidth = 页面对象宽度（即BODY对象宽度加上Margin宽） document.documentElement.clientHeight = 页面对象高度（即BODY对象高度加上Margin高） 网页可见区域宽： document.body.clientWidth 网页可见区域高： document.body.clientHeight 网页可见区域宽： document.body.offsetWidth (包括边线的宽) 网页可见区域高： document.body.offsetHeight (包括边线的高) 网页正文全文宽： document.body.scrollWidth 网页正文全文高： document.body.scrollHeight 网页被卷去的高： document.body.scrollTop 网页被卷去的左： document.body.scrollLeft 网页正文部分上： window.screenTop 网页正文部分左： window.screenLeft 屏幕分辨率的高： window.screen.height 屏幕分辨率的宽： window.screen.width 屏幕可用工作区高度： window.screen.availHeight 屏幕可用工作区宽度： window.screen.availWidth HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度。 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度 offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置 event.clientX 相对文档的水平座标 event.clientY 相对文档的垂直座标 event.offsetX 相对容器的水平坐标 event.offsetY 相对容器的垂直坐标 document.documentElement.scrollTop 垂直方向滚动的值 event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量 实现代码 复制代码代码如下: 请调整浏览器窗口 请调整浏览器窗口大小 浏览器窗口 的 实际高度: 浏览器窗口 的 实际宽度: DOCTYPE声明对JS获取窗口宽度和高度的影响在没有DOCTYPE声明的情况下:document.body.clientWidthdocument.body.clientHeight为当前窗口的宽度/高度;在DOCTYPE声明以后document.body.clientWidthdocument.body.clientHeight为整个页面的宽度/高度;document.documentElement.clientWidthdocument.documentElement.clientHeight为当前窗口的宽度/高度;同样增加DOCTYPE声明后document.body.scrollLeftdocument.body.scrollTop要改为document.documentElement.scrollLeftdocument.documentElement.scrollTopJS获取浏览器窗口巨细 获取屏幕，浏览器，网页高度宽度网页可见区域宽：document.body.clientWidth网页可见区域高：document.body.clientHeight网页可见区域宽：document.body.offsetWidth (包括边线的宽)网页可见区域高：document.body.offsetHeight (包括边线的宽)网页正文全文宽：document.body.scrollWidth网页正文全文高：document.body.scrollHeight网页被卷去的高：document.body.scrollTop网页被卷去的左：document.body.scrollLeft网页正文局部上：window.screenTop网页正文局部左：window.screenLeft屏幕辨别率的高：window.screen.height屏幕辨别率的宽：window.screen.width屏幕可用劳动区高度：window.screen.availHeight屏幕可用劳动区宽度：window.screen.availWidthHTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidthscrollHeight: 获取东西的滚动高度。scrollLeft:设置或获取位于东西左界限和窗口中目前可见内容的最左端之间的距离scrollTop:设置或获取位于东西最顶端和窗口中可见内容的最顶端之间的距离scrollWidth:获取东西的滚动宽度offsetHeight:获取东西相对付版面或由父坐标 offsetParent 属性指定的父坐标的高度offsetLeft:获取东西相对付版面或由 offsetParent 属性指定的父坐标的计算左侧位置offsetTop:获取东西相对付版面或由 offsetTop 属性指定的父坐标的计算顶端位置event.clientX 相对文档的水平座标event.clientY 相对文档的笔直座标event.offsetX 相对容器的水平坐标event.offsetY 相对容器的笔直坐标document.documentElement.scrollTop 笔直偏向滚动的值event.clientX document.documentElement.scrollTop 相对文档的水平座标笔直偏向滚动的量Css命名规范页头：header 登录条：loginbar 标志：logo 侧栏：sidebar 广告：banner 导航：nav 子导航：subnav 菜单：menu 子菜单：submenu 搜索：search 滚动：scroll 页面主体：main 内容：content 标签页：tab 文章列表：list 提