html登陆界面优化
{% load static %}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录界面</title>
<link rel="stylesheet" href="{% static 'css/index.css' %}">
<script src="{% static 'js/jquery.js' %}"></script>
</head>
<body>
<script>
$(document).ready(function () {
var whei = $(window).width()
$("html").css({ fontSize: whei / 24 });
$(window).resize(function () {
var whei = $(window).width();
$("html").css({ fontSize: whei / 24 })
});
});
</script>
<div class="main">
<div class="header">
<div class="header-center fl">
<div class="header-title">
登录界面
</div>
<div class="header-img"></div>
</div>
<div class="header-bottom fl"></div>
</div>
<div class="content">
<div class="content-left">
<!--<img src="images/d.png" alt="">-->
</div>
<div class="content-right">
<formaction=""method="post">
{% csrf_token %}
<div class="right-infp">
<div class="right-infp-name">
{{ form.username }}
</div>
<div class="right-infp-name">
{{ form.password }}
<span>{{ form.password.errors.0 }}</span>
</div>
<div class="right-infp-name">
{{ form.yzm }}
<span>{{ form.yzm.errors.0 }}</span>
</div>
<img id="captcha_img" src="/yzm" alt="captcha"width="130" height="30">
<a href="" id="refresh_captcha">换一张 看不清</a>
</div>
<div class="right-infp-btn">
<input type="submit" value="登陆" class="btn btn-primary">
</div>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
——————————————————————————————————————————————
前台显示界面为
可以看到报错内容在input框里面我想让报错界面显示到红框里面 要怎么操作呢 可以将报错信息直接插入到输入框中的value属性中，这样可以实现用户再次操作时方便查看和修改报错信息。以下是示例代码：
```html
<div class="right-infp-name">
<input type="text" name="{{ form.password.name }}" value="{{ form.password.value }}" placeholder="{{ form.password.label }}">
<span>{{ form.password.errors.0 }}</span>
</div>
```
需要注意的是，这里的{{ form.password.value }}需要在对应视图函数中传递form对象才能使用。另外，如果要实现在报错信息不为空时自动聚焦到对应输入框中，可以在页面加载完成时加上相应的JavaScript代码实现。 歌者文明清理员 发表于 2023-6-16 20:11
可以将报错信息直接插入到输入框中的value属性中，这样可以实现用户再次操作时方便查看和修改报错信息。以 ...
不行的
<div class="right-infp-name">
{{ form.password }}
</div>
<span>{{ form.password.errors.0 }}</span>
改成这样了显示不算太好
页:
[1]