最近在開發(fā)公司的一個系統(tǒng)，系統(tǒng)的框架是用ssm的框架搭建的，當(dāng)然和這次寫博客的不一樣，它擁有很多的配置文件，企業(yè)級的開發(fā)所需要的配置文件是非常繁瑣的，今天記錄一下一個簡單的ssm框架的搭建和實現(xiàn)一個crud的操作。
使用的是maven插件來配置我們需要的jar包，由于操作不多，所以并沒有配置很多，要注意自己使用的jdk的版本，選擇不同版本號的jdk
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
|
<project xmlns="http://maven.apache.org/pom/4.0.0" xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xsi:schemalocation="http://maven.apache.org/pom/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"> <modelversion>4.0.0</modelversion> <groupid>com.lr</groupid> <artifactid>ssm</artifactid> <packaging>war</packaging> <version>0.0.1-snapshot</version> <name>ssm maven webapp</name> <url>http://maven.apache.org</url> <!-- 用來設(shè)置版本號 --> <properties> <srping.version>4.0.2.release</srping.version> <mybatis.version>3.2.8</mybatis.version> <slf4j.version>1.7.12</slf4j.version> <log4j.version>1.2.17</log4j.version> </properties> <!-- 用到的jar包 --> <dependencies> <!-- 單元測試 --> <dependency> <groupid>junit</groupid> <artifactid>junit</artifactid> <version>4.11</version> <!-- 表示開發(fā)的時候引入，發(fā)布的時候不會加載此包 --> <scope>test</scope> </dependency> <!-- java ee包 --> <dependency> <groupid>javax</groupid> <artifactid>javaee-api</artifactid> <version>7.0</version> </dependency> <!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind --> <dependency> <groupid>com.fasterxml.jackson.core</groupid> <artifactid>jackson-databind</artifactid> <version>2.8.8</version> </dependency> <!-- spring框架包 start --> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-test</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-core</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-oxm</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-tx</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-jdbc</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-aop</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-context</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-context-support</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-expression</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-orm</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-web</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-webmvc</artifactid> <version>${srping.version}</version> </dependency> <dependency> <groupid>org.springframework</groupid> <artifactid>spring-aspects</artifactid> <version>${srping.version}</version> </dependency> <!-- spring框架包 end --> <!-- mybatis框架包 start --> <dependency> <groupid>org.mybatis</groupid> <artifactid>mybatis</artifactid> <version>${mybatis.version}</version> </dependency> <dependency> <groupid>org.mybatis</groupid> <artifactid>mybatis-spring</artifactid> <version>1.2.2</version> </dependency> <!-- mybatis框架包 end --> <!-- 數(shù)據(jù)庫驅(qū)動 --> <dependency> <groupid>mysql</groupid> <artifactid>mysql-connector-java</artifactid> <version>5.1.35</version> </dependency> <!-- 導(dǎo)入dbcp的jar包，用來在applicationcontext.xml中配置數(shù)據(jù)庫 --> <dependency> <groupid>commons-dbcp</groupid> <artifactid>commons-dbcp</artifactid> <version>1.4</version> </dependency> <!-- jstl標(biāo)簽類 --> <dependency> <groupid>jstl</groupid> <artifactid>jstl</artifactid> <version>1.2</version> </dependency> <dependency> <groupid>taglibs</groupid> <artifactid>standard</artifactid> <version>1.1.2</version> </dependency> <!-- log start --> <dependency> <groupid>log4j</groupid> <artifactid>log4j</artifactid> <version>${log4j.version}</version> </dependency> <dependency> <groupid>org.slf4j</groupid> <artifactid>slf4j-api</artifactid> <version>${slf4j.version}</version> </dependency> <dependency> <groupid>org.slf4j</groupid> <artifactid>slf4j-log4j12</artifactid> <version>${slf4j.version}</version> </dependency> <!-- log end --> <!-- json --> <!-- 格式化對象，方便輸出日志 --> <dependency> <groupid>com.alibaba</groupid> <artifactid>fastjson</artifactid> <version>1.2.6</version> </dependency> <dependency> <groupid>org.codehaus.jackson</groupid> <artifactid>jackson-mapper-asl</artifactid> <version>1.9.13</version> </dependency> <!-- 上傳組件包 start --> <dependency> <groupid>commons-fileupload</groupid> <artifactid>commons-fileupload</artifactid> <version>1.3.1</version> </dependency> <dependency> <groupid>commons-io</groupid> <artifactid>commons-io</artifactid> <version>2.4</version> </dependency> <dependency> <groupid>commons-codec</groupid> <artifactid>commons-codec</artifactid> <version>1.10</version> </dependency> <!-- 上傳組件包 end --> <!-- al相關(guān)添加 --> <dependency> <groupid>net.sourceforge.jexcelapi</groupid> <artifactid>jxl</artifactid> <version>2.6</version> </dependency> <dependency> <groupid>org.apache.poi</groupid> <artifactid>poi</artifactid> <version>3.8</version> </dependency> <dependency> <groupid>org.apache.poi</groupid> <artifactid>poi-ooxml</artifactid> <version>3.9</version> </dependency> <!-- al相關(guān)添加 --> </dependencies> <build> <finalname>maven_project</finalname> <plugins> <plugin> <groupid>org.apache.maven.plugins</groupid> <artifactid>maven-compiler-plugin</artifactid> <version>2.3.2</version> <configuration> <source>1.7</source> <target>1.7</target> </configuration> </plugin> </plugins> </build> </project> |
然后配置數(shù)據(jù)庫的連接，改成自己的數(shù)據(jù)庫就行了
|
1
2
3
4
5
6
7
8
|
driver=com.mysql.jdbc.driverurl=jdbc\:mysql\://locahost\:3306/dbusername=rootpassword=rootmaxactive=20maxidle=20minidle=1maxwait=60000 |
配置文件spring-dao.xml，spring會自動查找其下的類
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<?xml version="1.0" encoding="utf-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xmlns:p="http://www.springframework.org/schema/p" xmlns:context="http://www.springframework.org/schema/context" xmlns:mvc="http://www.springframework.org/schema/mvc" xsi:schemalocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.1.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.1.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.0.xsd"> <!-- dao接口所在包名，spring會自動查找其下的類 --> <bean class="org.mybatis.spring.mapper.mapperscannerconfigurer"> <!--basepackage指定要掃描的包，在此包之下的映射器都會被搜索到。 可指定多個包，包與包之間用逗號或分號分隔--> <property name="basepackage" value="com.lr.dao" /> <property name="sqlsessionfactory" ref="sqlsessionfactory"></property> </bean> </beans> |
配置文件spring和mybatis的整合文件
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
|
<?xml version="1.0" encoding="utf-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xmlns:p="http://www.springframework.org/schema/p" xmlns:context="http://www.springframework.org/schema/context" xmlns:mvc="http://www.springframework.org/schema/mvc" xsi:schemalocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.0.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-4.0.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.0.xsd"> <!-- 引入配置文件 --> <context:property-placeholder location="classpath:/jdbc.properties" /> <bean id="datasource" class="org.apache.commons.dbcp.basicdatasource" destroy-method="close"> <property name="driverclassname" value="com.mysql.jdbc.driver" /> <property name="url" value="jdbc:mysql://localhost:3306/db?useunicode=true&characterencoding=utf8" /> <property name="username" value="root" /> <property name="password" value="root" /> <!-- 初始化連接大小 --> <property name="initialsize" value="3" /> <!-- 連接池最大數(shù)量 --> <property name="maxactive" value="20" /> <!-- 連接池最大空閑 --> <property name="maxidle" value="20" /> <!-- 連接池最小空閑 --> <property name="minidle" value="1" /> <!-- 獲取連接最大等待時間 --> <property name="maxwait" value="60000" /> </bean> <!-- spring和mybatis完美整合，不需要mybatis的配置映射文件 --> <bean id="sqlsessionfactory" class="org.mybatis.spring.sqlsessionfactorybean"> <property name="datasource" ref="datasource" /> <!-- 自動掃描mapping.xml文件 --> <property name="mapperlocations" value="classpath:com/lr/mapper/*.xml"></property> </bean> </beans> |
配置事物的文件
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
|
<?xml version="1.0" encoding="utf-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xmlns:p="http://www.springframework.org/schema/p" xmlns:context="http://www.springframework.org/schema/context" xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx" xmlns:mvc="http://www.springframework.org/schema/mvc" xsi:schemalocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.1.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.1.xsd http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.1.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.1.xsd"> <!-- (事務(wù)管理)transaction manager, use jtatransactionmanager for global tx --> <bean id="transactionmanager" class="org.springframework.jdbc.datasource.datasourcetransactionmanager"> <property name="datasource" ref="datasource" /> </bean> <!-- 配置參與事務(wù)的類 --> <aop:config> <aop:pointcut id="allservicemethod" expression="execution(* com.lr.service.*.*(..))"/> <aop:advisor pointcut-ref="allservicemethod" advice-ref="txadvice" /> </aop:config> <!-- 使用聲明方式配置事務(wù) --> <tx:advice id="txadvice" transaction-manager="transactionmanager"> <tx:attributes> <tx:method name="*" propagation="required" rollback-for="java.lang.exception"/> </tx:attributes> </tx:advice> </beans> |
配置springmvc.xml文件
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
<?xml version="1.0" encoding="utf-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xmlns:p="http://www.springframework.org/schema/p" xmlns:context="http://www.springframework.org/schema/context" xmlns:mvc="http://www.springframework.org/schema/mvc" xsi:schemalocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.1.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.1.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.0.xsd"> <!-- 自動掃描 --> <context:component-scan base-package="com.lr.controller" /> <mvc:annotation-driven /> <mvc:default-servlet-handler/> <!-- 定義跳轉(zhuǎn)的文件的前后綴 ，視圖模式配置--> <bean class="org.springframework.web.servlet.view.internalresourceviewresolver"> <property name="prefix" value="/web-inf/jsp/" /> <property name="suffix" value=".jsp" /> </bean> |
好了！！！需要配置的文件已經(jīng)配置完成了，足夠我們進(jìn)行一波操作了
接下來是后臺的一些代碼，這里主要是實體類，dao層，service層，controller層，我把后臺的文件一起上傳了，mapper.xml文件是實現(xiàn)方法最關(guān)鍵的地方
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
|
<?xml version="1.0" encoding="utf-8"?><!doctype mapper public "-//mybatis.org//dtd mapper 3.0//en" "http://mybatis.org/dtd/mybatis-3-mapper.dtd" > <mapper namespace="com.lr.dao.iuserdao"> <resultmap id="baseresultmap" type="com.lr.dto.user"> <result column="id" property="id" jdbctype="integer" /> <result column="name" property="name" jdbctype="varchar" /> <result column="password" property="password" jdbctype="varchar" /> <result column="age" property="age" jdbctype="integer" /> </resultmap> <sql id="base_column_list"> id, name, password, age </sql> <!-- 增加用戶 --> <insert id="adduser" parametertype="com.lr.dto.user"> insert into user(name,password,age) values(#{name},#{password},#{age}) </insert> <!-- 查詢用戶--> <select id="querybyprimarykey" resultmap="baseresultmap" parametertype="java.lang.integer"> select <include refid="base_column_list" /> from user where id = #{id} </select> <!-- 刪除用戶 --> <delete id="deletebyprimarykey" parametertype="java.lang.integer"> delete from user where id = #{id} </delete> <!-- 更新用戶 --> <update id="updatebyprimarykey" parametertype="com.lr.dto.user" > update user set name=#{name},password=#{password},age=#{age} where id=#{id} </update> <select id="findalluser" resulttype="com.lr.dto.user"> select * from user </select> </mapper> |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
package com.lr.dao;import java.util.list;import com.lr.dto.user;public interface iuserdao { //查詢用戶 public user querybyprimarykey(int id); //刪除用戶 public int deletebyprimarykey(int id); //更新用戶 public int updatebyprimarykey(user user); //添加用戶 public int adduser(user user); //查詢所有用戶 public list<user> findalluser();} |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
package com.lr.service;import java.util.list;import com.lr.dto.user;public interface iuserservice { //查詢用戶 public user getuserbyid(int userid); //刪除 public void deleteuser(int id); //更新用戶 public void updateuser(user user); //添加用戶 public void adduser(user user); //查看所有用戶 public list<user> findalluser();} |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
|
package com.lr.service.impl;import java.util.list;import javax.annotation.resource;import org.springframework.stereotype.service;import com.lr.dao.iuserdao;import com.lr.dto.user;import com.lr.service.iuserservice;@service("userservice")public class userserviceimpl implements iuserservice{ @resource private iuserdao userdao; public iuserdao getuserdao() { return userdao; } public void setuserdao(iuserdao userdao) { this.userdao = userdao; } //查詢用戶 @override public user getuserbyid(int userid) { return userdao.querybyprimarykey(userid); } //更新用戶 @override public void updateuser(user user) { userdao.updatebyprimarykey(user); } //刪除用戶 @override public void deleteuser(int id) { userdao.deletebyprimarykey(id); } //添加用戶 @override public void adduser(user user) { userdao.adduser(user); } //查詢所有用戶 @override public list<user> findalluser() { return userdao.findalluser(); }} |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
|
package com.lr.controller;import java.util.list;import javax.servlet.http.httpservletrequest;import org.springframework.beans.factory.annotation.autowired;import org.springframework.stereotype.controller;import org.springframework.ui.model;import org.springframework.web.bind.annotation.requestmapping;import org.springframework.web.bind.annotation.responsebody;import com.lr.dto.user;import com.lr.service.iuserservice;@controllerpublic class usercontroller { @autowired private iuserservice userservice; public iuserservice getuserservice() { return userservice; } public void setuserservice(iuserservice userservice) { this.userservice = userservice; } //主頁面 @requestmapping("/") public string usermgr() { return "showuser"; } //添加用戶 @requestmapping("/adduser") @responsebody public void useradd(user user) { userservice.adduser(user); } //刪除用戶 @requestmapping("/deleteuser") @responsebody public void deleteuser(int id){ userservice.deleteuser(id); } //修改用戶 @requestmapping("/updateuser") @responsebody public void upadteuser(user user){ userservice.updateuser(user); } //根據(jù)id查找用戶 @requestmapping("/showuser") @responsebody public user showuser(int id,model model){ return userservice.getuserbyid(id); } //查詢所有用戶 @requestmapping("/findalluser") @responsebody public list<user> findalluser(){ return userservice.findalluser(); }} |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
|
<%@ page language="java" import="java.util.*" pageencoding="utf-8"%><!doctype html><html> <head> <meta charset="utf-8"><script type="text/javascript" src="<%= application.getcontextpath() %>/js/jquery-1.12.4.min.js"></script> <script type="text/javascript"> //添加用戶 $(function(){ $("#add").on("click", addnewuser); }) function addnewuser(){ var name = $.trim($("#txtname").val()); var password = $.trim($("#txtpassword").val()); var age = $.trim($("#txtage").val()); $.post("/ssm/adduser", {"name": name, "password": password, "age": age}, function(){ alert("添加成功！") }); } //刪除用戶 $(function(){ $("#delete").on("click",deleteuser); }) function deleteuser(){ var id=$.trim($("#deleteid").val()); $.get("/ssm/deleteuser",{"id":id},function(){ alert("刪除成功！") }); } //查詢所有用戶 $(function(){ $("#findalluser").click(function(){ $.ajax({ type:"post", datatype:"json", url:"/ssm/findalluser", success:function(msg){ var str=""; for(i in msg){ str+="<tr><th>"+msg[i].id+"</th><th>"+msg[i].name+"</th><th>" +msg[i].password+"</th><th>"+msg[i].age+"</th><tr>" } $("#findall").append(str); } }); }); }); //根據(jù)id查找一個用戶 $(function(){ $("#find").click(function(){ $.ajax({ type:"post", data:{id:$("#findid").val()}, datatype:"json", url:"/ssm/showuser", success:function(user){ var str=""; str+="<tr><th>"+user.id+"</th><th>"+user.name+"</th><th>" +user.password+"</th><th>"+user.age+"</th><tr>" $("#finduserbyid").append(str); } }) }) }) //根據(jù)id修改用戶信息 $(function(){ $("#update").on("click",updateuser); }) function updateuser(){ alert($.trim($("#updateid").val())) alert($.trim($("#updatename").val())) alert($.trim($("#updatepassword").val())) alert($.trim($("#updateage").val())) var id=$.trim($("#updateid").val()); var name=$.trim($("#updatename").val()); var password=$.trim($("#updatepassword").val()); var age=$.trim($("#updateage").val()); $.post("/ssm/updateuser",{"id":id,"name":name,"password":password,"age":age},function(){ alert("修改成功！") }); } </script> <title>用戶管理</title> </head> <body> <div> <p>姓名：<input type="text" id="txtname"></p> <p>密碼：<input type="password" id="txtpassword"></p> <p>年齡：<input type="text" id="txtage"></p> <p><button id="add">添加</button></p> </div> <hr style="height:1px;border:none;border-top:1px dashed #0066cc;" /> <div> <p>輸入用戶id:<input type="text" id="deleteid"></p> <p><button id="delete">刪除</button></p> </div> <hr style="height:1px;border:none;border-top:1px dashed #0066cc;" /> <div><p><button id="findalluser">查詢所有</button></p></div> <div> <table width="300" border="1" > <thead id="findall"> <tr> <th width="50">id</th> <th width="50">姓名</th> <th width="50">密碼</th> <th width="50">年齡</th> </tr> </thead> </table> </div> <hr style="height:1px;border:none;border-top:1px dashed #0066cc;" /> <div> <p>輸入用戶id:<input type="text" id="findid"></p> <p><button id="find">查詢</button></p> </div> <div> <table width="300" border="1" > <thead id="finduserbyid"> <tr> <th width="50">id</th> <th width="50">姓名</th> <th width="50">密碼</th> <th width="50">年齡</th> </tr> </thead> </table> </div> <hr style="height:1px;border:none;border-top:1px dashed #0066cc;" /> <div> <p>輸入用戶id:<input type="text" id="updateid"></p> <p>輸入用戶姓名:<input type="text" id="updatename"></p> <p>輸入密碼：<input type="password" id="updatepassword"></p> <p>輸入用戶年齡:<input type="password" id="updateage"></p> <p><button id="update">修改</button></p> </div> </body></html> |
原文鏈接：https://www.cnblogs.com/zuidongfeng/p/7903570.html
