常用图标库:
图标一般选用16*16规格的
iconfont.cn 阿里巴巴矢量图标库
esayicon.net ico图标库
easyui 单个下拉框初始化
//初始化单个下拉框
function initSelect(selector,ur){
$(selector).combobox({
valueField:'id', //默认编号字段id, 查询时应将主键添加别名 id,否则无效
textField:'text', //默认内容字段 text, 查询时应将主键添加别名 text,否则无效
eaitable:true,
url:ur,
method:'get' //默认get请求
});
}
easyui 三级联动公用对象
//easyui三级联动公用对象
function selec(urle){ //url
var obj={
valueField: 'id', //数据库查询出来的id别名
textField:'text', //数据库查询出来的字段别名
url:urle, //查询路径
method:'get' , //get请求
editable:false, //设置只能选择,不能自己编辑
};
return obj;
}
easyui三级(此处三层)联动入口,四个参数分别是:路径,按大,中,小顺序传参
// 初始化职位分类 rest 风格传参,url需加 '/'
//调用方法
thereLinkage("category/","#jobType_one","#jobType_two","#jobType_there");
function category(url, id_sel_one, id_sel_two, id_sel_there){
var object=selec(url+"0"); //一级父节点一般为0,若为其他自行修改
object.onSelect=function(rec){ //选择一级时,对象添加检测函数,进入二级操作,以此类推
$(id_sel_there).combobox('loadData', {}); //一级改变后,清除第三级的所有选项,二级会自动重新加载
$(id_sel_there).combobox("setText","-- 请选择 --"); //设置第三级别默认提示
var object_two=selec(url+rec.categid);
object_two.onSelect=function(rec){
var object_there=selec(url+rec.categid);
$(id_sel_there).combobox(object_there);
}
$(id_sel_two).combobox(object_two);
}
$(id_sel_one).combobox(object);
}
easyui三级联动获取最底层值,参数:三级选择器,一,二,三级
function getVel(sel_one,sel_two,sel_there){
var category_two=$(sel_two).combobox('getValue');
var category_id=$(sel_there).combobox('getValue');
if(!category_id){
category_id=category_two;
}else if(!category_two){
category_id=$(sel_one).combobox('getValue');
}
return category_id;
}
数据库结构
easyui 分页
var p = $('#mytable').datagrid("getPager");
$(p).pagination({
pageSize : 10, // 每页默认10条
pageList : [ 5, 10, 20, 30, 40, 50 ], // 可选择的每页显示多少条
beforePageText : '当前页 ', // 页面数字前的汉字提示
afterPageText : ' 共 {pages}', // 总页数
displayMsg : "当前{from} - {to} 条 共 {total} 条记录", // 当前1 - 10 条记录 共 21条
});
js 正则表达式
1、正则表达式
/^\\d+$/ //非负整数(正整数 + 0)
/^[0-9]*[1-9][0-9]*$/ //正整数
/^((-\\d+)|(0+))$/ //非正整数(负整数 + 0)
/^-[0-9]*[1-9][0-9]*$/ //负整数
/^-?\\d+$/ //整数
/^\\d+(\\.\\d+)?$/ //非负浮点数(正浮点数 + 0)
/^(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*))$/ //正浮点数
/^((-\\d+(\\.\\d+)?)|(0+(\\.0+)?))$/ //非正浮点数(负浮点数 + 0)
/^(-(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/ //负浮点数
/^(-?\\d+)(\\.\\d+)?$/ //浮点数
2、使用方法
var r = /^\+?[1-9][0-9]*$/; //正整数
String str = "123";
boolean flag=r.test(str);
如果判断为正整数,则flag为true
3、JS整数相加
首先保证输入的都是数字
nText1=parseFloat(document.all.text1.value);
nText2=parseFloat(document.all.text2.value);
nSum=nText1+nText2
百度地图调用
//网络地址,直接复制可用,无需下载文件
<head>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=iBM9rbzTH2dMZW7MbYMYmFgb"></script>
</head>
<body>
<input id="address" type="text" class="text_in" name="pt_particular_loction"/>
<script>
//value是要展示的具体位置
function map(value){
//百度地图展示
var map = new BMap.Map("allmap"); // 创建Map实例
map.centerAndZoom(value, 11); // 初始化地图,设置中心点坐标和地图级别
//添加地图类型控件
map.addControl(new BMap.MapTypeControl({
mapTypes:[
BMAP_NORMAL_MAP,
BMAP_HYBRID_MAP
]}));
map.setCurrentCity(value); // 设置地图显示的城市 此项是必须设置的
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
}
</script>
</body>
效果如下
文本域添加 编辑器
// 1. 简单文本域编辑器
<script type="text/javascript" src="/resource/kindeditor/kindeditor-all.js"></script>
<textarea name="pt_content" id="pt_content" style="height:200px;"></textarea>
var editor;
KindEditor.ready(function(K) {
editor = K.create('textarea[name="pt_content"]', {
resizeType : 1,
allowPreviewEmoticons : false,
allowImageUpload : false,
width:'550px',
items : [
'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
'insertunorderedlist', '|', 'emoticons', 'image', 'link'],
afterBlur: function(){this.sync();}
});
});
// 2. 富功能编辑器
<head>
<script src="/resource/kindeditor/kindeditor.js"></script>
<script src="/resource/kindeditor/kindeditor-all.js"></script>
<script src="/resource/kindeditor/kindeditor-all-min.js"></script>
<script charset="utf-8" src="/resource/kindeditor/lang/zh_CN.js"></script>
</head>
<body>
<textarea rows="3" style="width: 400px;overflow:auto" id="subject_text"
name="jobDesc" class="easyui-validatebox"
data-options="required:true,validType:'length[1,1000000]'"
invalidMessage="最大长度不能超过1000000">
</textarea>
var editor;
<script>
$(function() {
editor = KindEditor.create('textarea[name="subject_text"]',{
resizeType : 1,
width:"70%",
height:"130px",
afterChange:function(){
this.sync();
},afterBlur:function(){
this.sync();
}});
});
</script>
</body>
css渐变色样式
#grad {
line-height: 100px;
width: 500px;color:green;
font-size:18px;
font-weight:bold;
text-align:center;
background: linear-gradient(Red, orange, yellow,cyan,#9933FF,yellow,orange,Red);
/* background: linear-gradient(red, blue); 渐变色标准的语法,效果如下,为菜鸟教程调试样式截图
网址:http://www.runoob.com/css3/css3-gradients.html*/
}
ajax 传参可以传数组,json,map,list等等
$.ajax({
dataType:"json",// 参数类型,data 默认支持数组、对象,可以直接传
contentType:'application/json;charsetset=UTF-8',// 内容类型,设置后可以传map,
//默认为application/x-www-form-urlencoded
url:'updat',
type:'put',
data:{
'jobList':row.jobId,
'num':'4'
},
success:function(data){
successdata(data);
}
})
4.关于@ResquestBody:
接收的是一个Json对象的字符串,而不是一个Json对象
A)GET、POST方式提时, 根据request header Content-Type的值来判断:
application/x-www-form-urlencoded, 可选(即非必须,因为这种情况的数据@RequestParam, @ModelAttribute也可以处理,当然@RequestBody也能处理);
multipart/form-data, 不能处理(即使用@RequestBody不能处理这种格式的数据);
其他格式, 必须(其他格式包括application/json, application/xml等。这些格式的数据,必须使用@RequestBody来处理);
B) PUT方式提交时, 根据request header Content-Type的值来判断:
application/x-www-form-urlencoded, 必须;
multipart/form-data, 不能处理;
其他格式(其他格式包括application/json, application/xml等), 必须;
说明:request的body部分的数据编码格式由header部分的Content-Type指定;
故前台传递json数据时后台必须用@ResqustBody来处理,前台ajax必须指定contentType类型为
"application/json;charset=UTF-8",默认为application/x-www-form-urlencoded