输入的商品名 <input bindinput="getname"></input> 输入的价格 <input bindinput="getprice"></input> <button bindtap="addgood" type="primary">添加商品</button>
时间: 2024-10-23 12:18:52 浏览: 26
这段HTML代码展示了创建一个简单的表单来收集用户输入商品信息的过程。它包含两个输入字段:
1. `<input bindinput="getname">`:这是一个文本输入框,用户可以在这里输入商品名称。`bindinput`属性绑定到JavaScript函数`getname()`,可能是用于获取用户输入并处理名称数据。
2. `<input bindinput="getprice">`:这同样是一个输入框,用户输入商品价格。`bindinput`属性同样与名为`getprice()`的函数关联,负责获取和处理价格数据。
3. `<button bindtap="addgood" type="primary">添加商品</button>`:这个按钮允许用户提交信息。点击后会触发`addgood`事件处理器,表示将商品名和价格作为数据传递给“添加商品”的操作。
当你实际在JavaScript中实现时,需要编写对应的方法来处理这些输入,并可能将其存储在一个列表或其他数据结构中以便后续管理。例如:
```javascript
methods: {
getname() { ... },
getprice() { ... },
addgood(name, price) { ... }
}
```
相关问题
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ page import="com.bean.Sg" %> <%@ page import="com.dao.SgDao" %> <%@ page import="java.util.*" %> <%@ page import="com.dao.imp.SgDaoImp" %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <link type="text/css" rel="stylesheet" href="../css/ww.css"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> </head> <body> <div id="center"> <div id="up"><h2>搜索</h2></div> <form action="doindex.jsp" method="post"> <h2 id="ziti">字段:</h2><select name="ziduan" title="选择字段"> <option value="sgzh" value="sgzh">宿管用户名</option> <option value="uname" value="id">ID</option> </select> <h2 id="ziti2">值:</h2><input type="text" id="zhi" name="zhi" > <button value="开始搜索" id="b1" >开始搜索</button> </form> <button value="添加宿管信息" id="b2">添加宿管信息</button> </div> <table> <tr> <td>ID</td> <td>用户名</td> <td>密码</td> <td>姓名</td> <td>性别</td> <td>联系电话</td> <td>操作</td> <td>操作</td> </tr> <% if(session.getAttribute("uname")==null){ response.sendRedirect("login.jsp"); } %> <% List<Sg> sa=new ArrayList<Sg>(); SgDao s=new SgDaoImp(); sa=s.getSgList(); for(Sg sta:sa) { %> <tr> <td><%=sta.getId() %></td> <td><%=sta.getUsername() %></td> <td><%=sta.getPassword() %></td> <td><%=sta.getName() %></td> <td><%=sta.getSex() %></td> <td><%=sta.getPhone() %></td> <td><button onclick="del()">删除</button></td> <td><button onclick="del()">修改</button></td> </tr> <% } %> </table> </body> </html>实现这个页面的查询功能和删除表格行功能
这个页面是一个简单的搜索和删除功能的表格页面。要实现搜索功能,你可以在form标签中添加一个提交按钮,当用户点击按钮时,将表单数据提交到后台进行查询操作。在后台处理查询操作的servlet或者jsp页面中,你可以获取表单提交的字段和值,然后根据这些条件进行数据库查询操作,将查询结果返回到前台页面进行展示。
要实现删除功能,你可以为每一行的删除按钮添加一个onclick事件,当用户点击删除按钮时,调用一个JavaScript函数进行删除操作。在这个JavaScript函数中,你可以获取到需要删除的行的相关数据,然后通过AJAX请求将这些数据发送到后台进行删除操作。在后台处理删除操作的servlet或者jsp页面中,你可以接收到前台发送的数据,然后根据这些数据进行数据库删除操作。
需要注意的是,这只是一个大致的实现思路,具体的实现还需要根据你的后台代码和数据库结构来进行适配。希望对你有所帮助!
springboot+shiro的框架怎么写呢,我的maven是:<dependency> <groupId>org.apache.shiro</groupId> <artifactId>shiro-spring-boot-web-starter</artifactId> <version>1.8.0</version> </dependency> <dependency> <groupId>com.auth0</groupId> <artifactId>java-jwt</artifactId> <version>3.18.2</version> </dependency>
好的,对于使用 Spring Boot 和 Shiro 框架的项目,可以参照以下步骤进行搭建:
1. 在 pom.xml 文件中添加依赖:
```
<dependency>
<groupId>org.apache.shiro</groupId>
<artifactId>shiro-spring-boot-web-starter</artifactId>
<version>1.8.0</version>
</dependency>
<dependency>
<groupId>com.auth0</groupId>
<artifactId>java-jwt</artifactId>
<version>3.18.2</version>
</dependency>
```
其中,shiro-spring-boot-web-starter 是 Shiro 在 Spring Boot 中的集成包,java-jwt 是用于生成和解析 JWT 的库。
2. 在 application.properties 或 application.yml 文件中配置 Shiro:
```
# 配置 Shiro 的加密方式
shiro.hashAlgorithmName=md5
shiro.hashIterations=2
# 配置 JWT 的过期时间
jwt.expireTime=1800
# 配置 Shiro 的登录路径和首页路径
shiro.loginUrl=/login
shiro.successUrl=/index
# 配置 Shiro 的过滤器链
shiro.filterChainDefinitionMap= \
/static/** = anon \
/login = anon \
/logout = logout \
/** = authc
```
其中,shiro.hashAlgorithmName 和 shiro.hashIterations 是 Shiro 的加密方式,jwt.expireTime 是 JWT 的过期时间,shiro.loginUrl 和 shiro.successUrl 是 Shiro 的登录路径和首页路径,shiro.filterChainDefinitionMap 是 Shiro 的过滤器链。
3. 创建 Shiro 配置类,用于配置 Shiro 的各种组件:
```
@Configuration
public class ShiroConfig {
// 配置 SecurityManager
@Bean
public SecurityManager securityManager() {
DefaultWebSecurityManager securityManager = new DefaultWebSecurityManager();
securityManager.setRealm(myRealm()); // 配置自定义 Realm
securityManager.setRememberMeManager(cookieRememberMeManager()); // 配置 RememberMeManager
securityManager.setSessionManager(sessionManager()); // 配置 SessionManager
return securityManager;
}
// 配置自定义 Realm
@Bean
public MyRealm myRealm() {
return new MyRealm();
}
// 配置 RememberMeManager
@Bean
public RememberMeManager cookieRememberMeManager() {
CookieRememberMeManager rememberMeManager = new CookieRememberMeManager();
rememberMeManager.setCookie(rememberMeCookie());
return rememberMeManager;
}
// 配置 RememberMeCookie
@Bean
public SimpleCookie rememberMeCookie() {
SimpleCookie cookie = new SimpleCookie("rememberMe");
cookie.setMaxAge(86400); // 设置 Cookie 的过期时间为一天
return cookie;
}
// 配置 SessionManager
@Bean
public DefaultWebSessionManager sessionManager() {
DefaultWebSessionManager sessionManager = new DefaultWebSessionManager();
sessionManager.setSessionIdCookieEnabled(true);
sessionManager.setSessionIdUrlRewritingEnabled(false);
sessionManager.setSessionDAO(redisSessionDAO()); // 配置 RedisSessionDAO
sessionManager.setGlobalSessionTimeout(1800000); // 设置 Session 的过期时间为半小时
sessionManager.setDeleteInvalidSessions(true);
sessionManager.setSessionValidationSchedulerEnabled(true);
return sessionManager;
}
// 配置 RedisSessionDAO
@Bean
public RedisSessionDAO redisSessionDAO() {
RedisSessionDAO redisSessionDAO = new RedisSessionDAO();
redisSessionDAO.setRedisManager(redisManager()); // 配置 RedisManager
redisSessionDAO.setKeyPrefix("shiro:session:");
redisSessionDAO.setExpire(1800); // 设置 Session 的过期时间为半小时
return redisSessionDAO;
}
// 配置 RedisManager
@Bean
public RedisManager redisManager() {
RedisManager redisManager = new RedisManager();
redisManager.setHost("localhost");
redisManager.setPort(6379);
redisManager.setTimeout(0);
return redisManager;
}
// 配置 ShiroFilterFactoryBean
@Bean
public ShiroFilterFactoryBean shiroFilterFactoryBean() {
ShiroFilterFactoryBean factoryBean = new ShiroFilterFactoryBean();
factoryBean.setSecurityManager(securityManager());
factoryBean.setLoginUrl("/login");
factoryBean.setSuccessUrl("/index");
factoryBean.setUnauthorizedUrl("/unauthorized");
factoryBean.setFilterChainDefinitionMap(shiroFilterChainDefinition().getFilterChainMap());
return factoryBean;
}
// 配置 ShiroFilterChainDefinition
@Bean
public ShiroFilterChainDefinition shiroFilterChainDefinition() {
DefaultShiroFilterChainDefinition chainDefinition = new DefaultShiroFilterChainDefinition();
chainDefinition.addPathDefinition("/static/**", "anon");
chainDefinition.addPathDefinition("/login", "anon");
chainDefinition.addPathDefinition("/logout", "logout");
chainDefinition.addPathDefinition("/**", "authc");
return chainDefinition;
}
}
```
其中,myRealm() 方法用于配置自定义 Realm,cookieRememberMeManager() 方法用于配置 RememberMeManager 和 RememberMeCookie,sessionManager() 方法用于配置 SessionManager 和 RedisSessionDAO,redisManager() 方法用于配置 RedisManager,shiroFilterFactoryBean() 方法用于配置 ShiroFilterFactoryBean,shiroFilterChainDefinition() 方法用于配置 ShiroFilterChainDefinition。
4. 创建自定义 Realm 类,用于实现用户的认证和授权逻辑:
```
public class MyRealm extends AuthorizingRealm {
// 配置加密方式
@Override
public void setCredentialsMatcher(CredentialsMatcher credentialsMatcher) {
HashedCredentialsMatcher matcher = new HashedCredentialsMatcher();
matcher.setHashAlgorithmName("md5");
matcher.setHashIterations(2);
super.setCredentialsMatcher(matcher);
}
// 用户认证
@Override
protected AuthenticationInfo doGetAuthenticationInfo(AuthenticationToken token) throws AuthenticationException {
UsernamePasswordToken upToken = (UsernamePasswordToken) token;
String username = upToken.getUsername();
String password = new String(upToken.getPassword());
// 根据用户名和密码查询用户信息
User user = userService.findByUsernameAndPassword(username, password);
if (user == null) {
throw new UnknownAccountException("用户名或密码错误");
}
SimpleAuthenticationInfo info = new SimpleAuthenticationInfo(user, user.getPassword(), getName());
return info;
}
// 用户授权
@Override
protected AuthorizationInfo doGetAuthorizationInfo(PrincipalCollection principals) {
SimpleAuthorizationInfo info = new SimpleAuthorizationInfo();
User user = (User) principals.getPrimaryPrincipal();
// 根据用户角色查询权限信息
List<Role> roles = userService.findRolesByUsername(user.getUsername());
for (Role role : roles) {
info.addRole(role.getName());
List<Permission> permissions = role.getPermissions();
for (Permission permission : permissions) {
info.addStringPermission(permission.getName());
}
}
return info;
}
}
```
在自定义 Realm 类中,通过 setCredentialsMatcher() 方法配置加密方式,通过 doGetAuthenticationInfo() 方法实现用户的认证逻辑,通过 doGetAuthorizationInfo() 方法实现用户的授权逻辑。
5. 创建登录控制器,用于处理用户的登录和注销:
```
@Controller
public class LoginController {
@GetMapping("/login")
public String login() {
return "login";
}
@PostMapping("/login")
public String login(String username, String password, boolean rememberMe, HttpServletRequest request) {
try {
// 将用户名和密码封装成 UsernamePasswordToken 对象
UsernamePasswordToken token = new UsernamePasswordToken(username, password);
// 设置 RememberMe
token.setRememberMe(rememberMe);
// 执行登录操作
SecurityUtils.getSubject().login(token);
return "redirect:/index";
} catch (UnknownAccountException e) {
request.setAttribute("error", "用户名不存在");
} catch (IncorrectCredentialsException e) {
request.setAttribute("error", "密码错误");
} catch (LockedAccountException e) {
request.setAttribute("error", "账号已被锁定");
} catch (AuthenticationException e) {
request.setAttribute("error", "登录失败:" + e.getMessage());
}
return "login";
}
@GetMapping("/logout")
public String logout() {
SecurityUtils.getSubject().logout();
return "redirect:/login";
}
}
```
在登录控制器中,通过 login() 方法实现用户的登录操作,通过 logout() 方法实现用户的注销操作。
6. 在页面中添加登录界面和首页,例如:
```
<!-- 登录界面 -->
<form method="post" action="/login">
<div class="form-group">
<label for="username">用户名:</label>
<input type="text" id="username" name="username" class="form-control" required>
</div>
<div class="form-group">
<label for="password">密码:</label>
<input type="password" id="password" name="password" class="form-control" required>
</div>
<div class="form-check">
<input type="checkbox" id="rememberMe" name="rememberMe" class="form-check-input">
<label for="rememberMe" class="form-check-label">记住我</label>
</div>
<button type="submit" class="btn btn-primary">登录</button>
</form>
<!-- 首页 -->
<h1>欢迎登录</h1>
<p><a href="/logout">退出登录</a></p>
```
通过以上步骤,就可以使用 Spring Boot 和 Shiro 框架来实现用户的认证和授权了,当然,在具体实现时,还需要针对自己的业务需求进行一些调整和优化。
阅读全文