首页 > 代码库 > web项目一些小知识

web项目一些小知识

form表单中所有按钮默认会被当做提交按钮,所以不要在form表单中用多个按钮,可以用按钮外观的a标签来替换除提交按钮之外的其他按钮(bootstrap中只需要加上class="btn"就可以获得按钮外观)。
jquery对象和DOM对象是不同的,使用方法时必须注意区分调用方法的对象是何种类型,比如 $("#p1").html("123");document.getElementById("p1").innerHTML="123";前者是jquery方法,后者是DOM方法。
jquery中使用val(),原生js用value,还有类似比如text()和textContent等。jquery对象是对DOM对象进行包装后的对象。通过使用get(索引值)或者[索引值]的方式可以把jquery对象转换为DOM对象,$()包裹dom对象就能得到jquery对象
比如$("#p1")[0].innerHTML="123"或者$("#p1").get(0).innerHTML="123"都是可行的。
文本框、密码框、文本域输入值获取用textContent或者jquery的val()方法,span标签中的文本值jquery的text()方法。

获得下拉列表的选中项可以直接用jquery的val()方法,比如#("#select123").val(),如果value中传递了参数,表示设置默认选中值。
例如有如下下拉列表:
<select id="sel1">
    <option value="http://www.mamicode.com/亚洲" selected>亚洲</option>
    <option value="http://www.mamicode.com/欧洲">欧洲</option>
    <option value="http://www.mamicode.com/非洲">非洲</option>
</select>
$("#sel1").val()得到的结果是:亚洲,因为上面的下拉列表设置默认选中值是亚洲。而如果$("#sel1").val("欧洲")表示让下拉列表中value为"欧洲"的option被选中,这一点常用在修改界面显示用户修改前的旧信息。
通过给输入文本框和文本域设置设置value="http://www.mamicode.com/XXXX"可以直接设置默认值,而不用通过js代码来设置,配合el表达式使用非常方便,尤其是在修改功能中,比如修改前在请求中设置一个属性,值为要修改的对象。

如果想要通过在请求中设置属性的方式将参数传递给下一个页面,那么必须用请求转发的方式,而决不能用重定向,因为重定向会丢失请求,客户端第一次请求到达服务器,服务器返回一个重定向的地址,客户端再次发送第二次请求,之前设置的属性已经被丢失了。
例如 request.setAttribute(user),然后在需要显示并修改电话输入框可以直接写成 电话:<input value="http://www.mamicode.com/${user.tel}"/>
select.options可以直接获取到下拉列表的option数组,这是原生js方法。
jsp页面的js中可以直接使用el表达式来获取jsp中的变量值,但仅限于jsp页面,比如session中有个name属性,js代码中可以写为:var name="${name}",注意要加引号

当然也可以在页面中用隐藏的方式储存我们需要的信息,再利用选择器获取我们想要的内容。例如:session中有userName属性,我们可以将其放在span标签中然后在页面隐藏,js代码中获取对应span标签的文本就可以取得想要的值
<span id="userName" style="display:none">${userName}</span>         -----------------js中$("#userName").text()就可以获取到值

与session默认支持存放对象不同,cookie默认存放字符串,如果要存放对象,则需要进行序列化传送和反序列化解析。cookie默认不支持中文,也不支持逗号空格下划线等特殊字符
假如cookie中属性值为中文,那么需要进行编码和解码。比如:
设置cookie中文属性值:String name="张三";int id=1;Cookie cookie=new Cookie("name_id",URLEncoder.encode(name+","+id,"utf-8"));
获取cookie中文属性值:String name=URLDecoder.decode(cookie.getValue(),"UTF-8"),然后按照拼接时候的特点拆分字符串
当自己编写了一个方法根据传过来的请求获取其中的参数值并自动装配成bean时,如果请求中包含的属性在对应实体类中找不到该属性,那么就会抛出异常,然后获取枚举对象是根据表单中元素的name属性
来获得的,所以只要不给不需要的表单元素设置name属性,就可以避免异常。比如"确认密码"这一input元素就不需要设置name,只给输入密码的input设置name,并且名称和实体类对应属性保持一致就行。

word-wrap:break-word;word-break:break-all;在style中加入这两句话可以解决div内文字超div边界问题,让文字自动换行
js的方法中默认情况下中文参数是无法解析的,除了进行编码和解码外。还可以通过加引号的方式,需要注意的是,在ajax中拼接a标签指向某个js方法时,如果参数是中文,那么就需要将中文参数用引号包起来,这时候会出现三重引号,第三重必须用转义引号。
例如在ajax中,$.post("/user/findById","id=1",function(user){
//ajax中获得了后台返回的user对象,包含了属性id和姓名userName(值为中文)
var str="<a href=‘javascript:show("+user.id+",\""+user.userName+"\"‘)>查看</a>"
....后续操作

},"jason")


function show(id,name){
alert(id+" "+name)
}

servlet中文乱码处理

如果是post
设置req.setCharacterEncoding("utf-8");

如果是get,不去修改服务器配置的情况下


new String(name.getBytes("iso-8859-1"),"utf-8")

 

a标签进行页面跳转时,如果路径中拼接了中文参数,那么即使过滤器中设置了response.setCharacterEncoding("utf-8") 也会出现乱码,因为这种设置针对的是post方式,而a标签是get方式,比如路径
http://localhost:8080/jobProject/index.jsp?name=张三,张三会乱码,如果是jsp页面,可以在脚本中利用java代码进行转换,如,String name=new String(request.getParameter("iso8859-1"),"utf-8")。

如果不是jsp页面,那么需要编码和解码

数据库乱码
jdbc:mysql://127.0.0.1:3306?useUnicode=true&characterEncoding=UTF-8

web项目一些小知识