java:邮箱配置,点击配置,弹出弹窗,弹窗中可以对邮箱输入框进行动态的增加和删除,并且可以回显配置的邮箱,通过easyui+ssm实现前后端具体代码
时间: 2024-03-16 15:44:56 浏览: 71
好的,下面是Java邮箱配置的前后端代码实现。其中,前端使用了easyui框架,后端使用了SSM框架。
前端代码:
HTML部分:
```html
<div class="form-group">
<label class="col-sm-2 control-label">邮箱配置:</label>
<div class="col-sm-10">
<div class="config-email-container"></div>
<a href="#" class="btn btn-success btn-add-email" style="margin-top: 10px;">添加邮箱</a>
</div>
</div>
```
JS部分:
```javascript
$(function() {
// 初始化邮箱配置
var emails = ["example1@domain.com", "example2@domain.com"];
for (var i = 0; i < emails.length; i++) {
addEmail(emails[i]);
}
// 添加邮箱按钮的点击事件
$(".btn-add-email").click(function() {
addEmail("");
});
// 添加邮箱的函数
function addEmail(email) {
var container = $(".config-email-container");
var row = $("<div>").addClass("row");
var col = $("<div>").addClass("col-sm-10 col-sm-offset-2");
var input = $("<input>").attr("type", "text").attr("name", "emails").addClass("form-control").val(email);
var btnRemove = $("<a>").attr("href", "#").addClass("btn btn-danger btn-remove-email").text("删除邮箱");
col.append(input).append(btnRemove);
row.append(col);
container.append(row);
}
// 删除邮箱按钮的点击事件
$(".config-email-container").on("click", ".btn-remove-email", function() {
$(this).closest(".row").remove();
});
});
```
后端代码:
Java部分:
```java
@Controller
@RequestMapping("/email")
public class EmailController {
@RequestMapping("/config")
public String configEmail(Model model) {
model.addAttribute("emails", new ArrayList<String>());
return "email/config";
}
@RequestMapping(value = "/save", method = RequestMethod.POST)
@ResponseBody
public Map<String, Object> saveEmail(@RequestParam("emails[]") List<String> emails) {
// TODO: 保存邮箱配置
Map<String, Object> result = new HashMap<String, Object>();
result.put("success", true);
return result;
}
}
```
XML部分:
```xml
<!-- 配置MyBatis的SQL映射文件 -->
<mapper namespace="com.example.mapper.EmailMapper">
<insert id="insertEmails">
INSERT INTO email (address)
VALUES
<foreach collection="emails" item="email" separator=",">
(#{email})
</foreach>
</insert>
</mapper>
```
JSP部分:
```jsp
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<form:form method="post" action="/email/save">
<div class="form-group">
<label class="col-sm-2 control-label">邮箱配置:</label>
<div class="col-sm-10">
<div class="config-email-container">
<c:forEach items="${emails}" var="email">
<div class="row">
<div class="col-sm-10 col-sm-offset-2">
<form:input path="emails" cssClass="form-control" value="${email}" />
<a href="#" class="btn btn-danger btn-remove-email">删除邮箱</a>
</div>
</div>
</c:forEach>
</div>
<a href="#" class="btn btn-success btn-add-email" style="margin-top: 10px;">添加邮箱</a>
</div>
</div>
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<button type="submit" class="btn btn-primary">保存</button>
</div>
</div>
</form:form>
```
阅读全文