layui01

• 一、入门
• • 前提
  • 案例1
  • 案例2：使用自定义模块
• 二、json：数组或对象转成字符串
• 三、登录基本功能

先导jar包依赖

jsp里面引入css和js
< !-- 引入 layui.css -->
< link rel=“stylesheet” href=“${pageContext.request.contextPath}/static/js/layui.css”>

< !-- 引入 layui.js -->
< script src=“${pageContext.request.contextPath}/static/js/layui/layui.js”>< /script >

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>





 






请输入，
点我
 

运行结果

先搞一个mymod，
下面展示 mymod代码。

layui.define(function(exports){ //提示：模块也可以依赖其它模块，如：layui.define('mod1', callback);
  var obj = {
    hello: function(str){
      alert('Hello '+ (str||'mymod'));
    },say: function(str){
      alert('say '+ (str||'mymod'));
    }
  };
  
  //输出 mymod 接口
  exports('mymod', obj);
});    

再写一个mymodule_config.js的配置文件
下面展示mymodule_config.js代码。

//config的设置是全局的
layui.config({
  base: 'static/js/layui/mymodule/js/' //假设这是你存放拓展模块的根目录
}).extend({ //设定模块别名
  mymod: 'mymod' //如果 mymod.js 是在根目录，也可以不用设定别名
});

下面展示 案例2代码。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>





 








请输入，
点我
请输入相关文字，
点我
 

运行结果

json对象字符串的来源有两个：map和对象
json数组字符串的来源有两个：list《map》和list《user》
下面展示 代码。

package com.yzp.demo1;

import java.util.HashMap;
import java.util.Map;

import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;

public class YzpDemo1 {
	public static void main(String[] args) throws Exception {
		Map map1 = new HashMap();
		map1.put("name", "猪崽");
		map1.put("age", 19);
		ObjectMapper om = new ObjectMapper();
//		writeValueAsString将对象/数组转成json字符串
		System.out.println(om.writeValueAsString(map1));
		User user = new User("猪崽",10);
		System.out.println(om.writeValueAsString(user));

	}
}

class User{
	 private String name;
	 private int age;
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public int getAge() {
		return age;
	}
	public void setAge(int age) {
		this.age = age;
	}
	public User(String name, int age) {
		super();
		this.name = name;
		this.age = age;
	}
	public User() {
		// TODO Auto-generated constructor stub
	} 
}

运行结果

package com.yzp.demo1;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.Map;

import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;

public class YzpDemo1 {
	public static void main(String[] args) throws Exception {
		ArrayList