1. 微信公众号前端

在web页面中开发主要用到WeUI、viewport、rem

1. WeUI

   使用链接为
   https://github.com/pengtikui/WeUI-Simple-Guide
   很好用可快速搞定前端页面显示

2. viewport

   链接为
   http://www.runoob.com/css/css-rwd-viewport.html
   `

>> 一行代码即可使页面适应手机屏幕，具体介绍可参考链接，很好用
>> 
> 3. rem
>> rem之后好像没怎么用，以后有更多了解再来补充
>> 
> 4. 微信JSSDK开发文档
>> 这个不太懂具体作用，以后了解了再来补充(..›ᴗ‹..)
>> 
> 
# 2. AJAX
> 
> 之前开发中也有用到，经常用到，在这里总结一下，主要为代码举例（两个select级联）：
> 
> 1. html:

请选择
<c:forEach var=”value” items=”${tblist}”>

${value}

</c:forEach>

>> 
> 2. js:

function getCRList() {
var $tblist = $(“#tblist”).val();

$('#tblist').val($tblist); //让第一个下拉框保持显示选中的值  
$('#crlist').html(""); //把ci内容设为空  

var $crValue = $('#crlist'); 
$crValue.append('<option value="">请选择</option>');  

$.ajax({
    url : "<%=request.getContextPath()%>/showCRList",
    type : "GET",
    dataType : "json",  
    async: false,//default is true ,and if it is true,the flag in ajax cant return
                //cant be false because in chinese it means "异步"
    data: {
        tblist : $tblist  //传给后台的值
    },
    success : function(data, textStatus, jqXHR) {    //data为从后台取回的值    
            if (data && data.length > 0) {  
            var html = [];  
            for (var i = 0; i < data.length; i++) { 
                html.push('<option value="'+data[i]+'">'+data[i]+'</option>');  
            }  
            $crValue.append(html.join(''));  
        }  
    }  
    });
}

>> 
> 3. Servlet

public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

response.setContentType("application/json");  //使用json格式

response.setCharacterEncoding("UTF-8");
request.setCharacterEncoding("UTF-8");

tblist = (String) request.getParameter("tblist");  //不可以用getAttribute...
rtn2 = crUtil.getCRList(tblist);

PrintWriter writer = response.getWriter();  
JSONArray array = JSONArray.fromObject(rtn2); 

writer.append(array.toString());

}

>> 
> 4. CRUtil

public List getCRList(String tbname){

List<String> rtn2 = new ArrayList<String>();
String sql2="SELECT NAME FROM crinfo WHERE tbId = (SELECT id FROM tbinfo WHERE NAME = '" + tbname + "')";        
rtn2 = dbutil.getListInfo(sql2);
return rtn2;

}

> 5. DatabaseUtil

/*

* 获得列表信息
*/

public List getListInfo(String sql){

List<String> rsList = new ArrayList<String>();

String result = null;

Connection conn=null;

String url="jdbc:mysql://localhost:3306/person_seat_detection";
String user_="root";
String psd="123456";


try {
    Class.forName("com.mysql.jdbc.Driver");
    conn=DriverManager.getConnection(url,user_,psd);

    PreparedStatement ps=
            conn.prepareStatement(sql);
    ResultSet rs=ps.executeQuery();
    while(rs.next()){
        rsList.add(rs.getString(1));
    }

} catch (Exception e) {
    System.out.println(e.getMessage());
}finally {
    if (conn!=null) {
        try {
            conn.close();
        } catch (Exception e2) {
        }
    }

}

return rsList;

}

>> 
> 6. web.xml配置
>>

<servlet>
    <servlet-name>crServlet</servlet-name>
    <servlet-class>com.imooc.servlet.CRServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>crServlet</servlet-name>
    <url-pattern>/showCRList</url-pattern>
  </servlet-mapping>```                            

---