我正在使用 struts2 开发一个网页。我想用红色边框突出显示我的用户 ID/密码文本字段，并在用户名/密码错误时显示错误消息
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<html>
<head>
<title>Stock Portfolio Management</title>
</head>
<FONT COLOR=black><marquee BEHAVIOR=ALTERNATE><h1 ALIGN="center">STOCK PORTFOLIO</h1></marquee></FONT>
<style type="text/css">
body
{
/* background: url(./image/9.jpg) no-repeat fixed; */
/* -webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover; */
postion:fixed
}
img
{
position:fixed;
bottom: 20%;
left: 20%;
margin-top: -50px;
margin-left: -100px;
}
#login
{
position:fixed;
top: 20%;
left: 50%;
margin-top: -50px;
margin-left: -100px;
}
.errors {
background-color:#FFCCCC;
border:1px solid #CC0000;
width:350px;
margin-bottom:2px;
position:relative;
left:0pt;
bottom:10pt;
}
.errors li{
list-style: none;
}
</style>
<body>
<img src="image/9.jpg" height="250" width="300">
<s:form id="login" action="authenticate" method="post">
<s:textfield name="userid" key="User Id" size="25" />
<s:password name="password" label="Password" size="25" />
<s:if test="hasActionErrors()">
<div class="errors">
<s:actionerror/>
</div>
</s:if>
<s:submit method="CheckUser" value="Login" align="center" /> <s:reset value="Reset" align="center" />
<a href="<s:url action="moveregister" method="execute"/>">New User?</a>
 
<a href="<s:url action="forgotpassword" method="forgot"/>">Forgot Password?</a>
</s:form>
</body>
</html>
这是我的 Action 类中的内容:
addActionError(getText("User Id which you provided doesnt exists"));
return "error";
如您所见，我正在捕获错误并使用 .errors 在屏幕上显示并使用上面的 CSS 对其进行格式化。
但我想突出显示带有红色边框的错误，例如 userID字段(如果有错误)或密码字段(如果有错误)。我尝试谷歌搜索，发现了很多类似编辑模板的东西class/<s:fielderror>等但无法生产。
最佳答案
首先，将所有 HTML 放在它应该在的位置；
其次，用红色边框装饰字段通常是显示验证错误的约定:例如，格式错误(或超出范围)的日期、数字字段中的字符、留空的必填字段等等... Struts2 中的验证应由 ValidationInterceptor 执行，最好通过 XML，为 <s:fielderrors/> 中的每个字段添加一个错误标签。您的情况有所不同:您通过了验证，执行了 Action 的方法，但结果是“用户未经过身份验证”:在大多数 Web 应用程序中，这会导致显示红色错误消息，而不装饰用户名和密码字段(如果它们留空，你应该装饰它们......)。
但是，如果你想装饰它们，为什么不使用 Javascript 呢？
在 CSS 样式中添加此内容:
.decoratedErrorField{
border:2px solid red;
}
将 ID 添加到您的字段:
<s:textfield name="userid" id="userid" key="User Id" size="25" />
<s:password name="password" id="password" label="Password" size="25" />
如果发生错误，则通过 ID 获取字段并通过向其添加错误类来对它们进行修饰；
将其添加到页面末尾 </body> 之前:
<s:if test="hasActionErrors()">
<script type="text/javascript">
//<![CDATA[
document.getElementById("userid").className += " decoratedErrorField ";
document.getElementById("password").className += " decoratedErrorField ";
//]]>
</script>
</s:if>
关于css - 在 struts2 中突出显示带有红色边框的 TextField 错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13901450/