b.1.text文本框点击和失去焦点
var textverify=function(){
//空值验证
$("#loginusername").focus(function(){
//console.log(1);console.log(typeof(username));
var username = $(this).val();
if(username=="输入账号"){
$(this).val("");
}
});
$("#loginusername").focusout(function(){
var username = $(this).val();
if(username==""){
$(this).val("输入账号");
}
});
$("#loginpassword").focus(function(){
var password = $(this).val();
if(password=="输入密码"){
$(this).val("");
}
});
$("#loginpassword").focusout(function(){
var password = $(this).val();
if(password==""){
$(this).val("输入密码");
}
});
$("#checkimg").focus(function(){
var password = $(this).val();
if(password=="输入验证码"){
$(this).val("");
}
});
$("#checkimg").focusout(function(){
var password = $(this).val();
if(password==""){
$(this).val("输入验证码");
}
});
};
b.2.ajax序列化表单提交
var ajaxuser = function() {
$.ajax({
type : "post",
url : "/homeofcar/user/login",
data : $("form:eq(0)").serialize(),
success : function(data) {
if (data != null && data != "") {
window.location.href = "/homeofcar/show/main";
} else {
$("#error_box span").show();
}
},
dataType : "json"
});
};
b.3.利用getJson()获取数据、动态构建table行
$(function(){
$.getJSON(
"/homeofcar/user/getjson",
function(data) {
var list = data;
//循环
$.each(list,function(i,user){
//构建行
var $tr = $("<tr></tr>");
//复选框
$tr.append('<td><input type="checkbox"/></td>');
//用户
$tr.append("<td>"+user.realname+"</td>");
//角色
var juese = '<td><table cellspacing="0" cellpadding="0" border="1" style="border-collapse: collapse;border-width:0px; border-style:hidden;">';
$.each(user.listRole,function(j,role){
juese = juese + "<tr><td>"+role.rolename+"</td></tr>";
});
juese+="</table></td>";
$tr.append(juese);
//权限
var quanxian = '<td><table cellspacing="0" cellpadding="0" border="1" style="border-collapse: collapse;border-width:0px; border-style:hidden;">';
var index=["[系统管理:]","[仓库管理:]","[统计管理:]","[销售管理:]","[客户管理:]"];
$.each(user.listRole,function(j,role){
quanxian+="<tr><td>";
$.each(role.listModule,function(k,module){
if (module.paretid != 0) {
if (module.paretid != role.listModule[k-1].paretid)
quanxian+=" "+index[module.paretid-1];
quanxian+=" "+module.modulename;
}
});
quanxian+="</td></tr>";
});
quanxian+="</table></td>";
$tr.append(quanxian);
//编辑 <td><a href="/user/userupdate/id">编辑</a></td>
$tr.append('<td><a href="user/userupdate?userid='+user.userid+'">编辑</a></td>');
//构建行追加
$("#tablemax").append($tr);
});
});//getJSON
});
b.4.JSP中EL表达式和js关系
(个人理解)在页面的JavaScript中是可以通过EL表达式取到作用域里面的值的,不过值得注意的是EL表达式的优先级别高于页面的JavaScript,因此在页面的JavaScript中只能用EL表达式取某一个值,而不能动态的构建EL表达式。当在JavaScript中对EL表达式进行拼接时会报错。
//错误案例
$("#table").append("<tr><td>${roleList["+i+"].rolename}</td></tr>");//i是循环的变量
//成功案例
$("#table").append("<tr><td>${roleList[0].rolename}</td></tr>");//不对EL表达式进行拼接