用户名输入框 密码输入框 密码不能显示 有记住密码按钮 还有提交按钮
时间: 2024-05-09 16:19:58 浏览: 8
可以使用以下 HTML 代码:
```html
<form>
<label for="username">用户名:</label>
<input type="text" id="username" name="username"><br><br>
<label for="password">密码:</label>
<input type="password" id="password" name="password"><br><br>
<input type="checkbox" id="remember" name="remember">
<label for="remember">记住密码</label><br><br>
<input type="submit" value="提交">
</form>
```
这里使用了 `<form>` 元素来包含表单内容,`<label>` 元素来标记输入框的名称,`<input>` 元素来创建输入框,`type="password"` 属性用于创建密码输入框,`type="checkbox"` 属性用于创建记住密码按钮,`<input type="submit">` 元素用于创建提交按钮。
需要注意的是,这个代码只是一个示例,实际应用中需要根据具体情况进行修改和优化。
相关问题
用户名输入框,密码输入框,提交按钮的登录验证界面
好的,以下是一个简单的用户名输入框、密码输入框和提交按钮的登录验证界面的 HTML 和 JavaScript 代码示例:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>登录验证界面</title>
</head>
<body>
<form id="loginForm">
<label for="username">用户名:</label>
<input type="text" id="username" name="username"><br><br>
<label for="password">密码:</label>
<input type="password" id="password" name="password"><br><br>
<input type="button" value="提交" onclick="login()">
</form>
<script>
function login() {
// 获取用户名和密码
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
// 进行校验
if (username === "" || password === "") {
alert("用户名和密码不能为空!");
return false;
} else if (username !== "admin" || password !== "123456") {
alert("用户名或密码错误!");
return false;
} else {
alert("登录成功!");
return true;
}
}
</script>
</body>
</html>
```
在上述代码中,我们使用了 HTML 的 `<form>` 元素来包裹用户名输入框、密码输入框和提交按钮,并给表单元素指定了一个唯一的 ID,方便后面使用 JavaScript 代码获取表单中的数据。
在 JavaScript 代码中,我们使用了 `document.getElementById()` 方法获取了用户名输入框和密码输入框的值,并进行了简单的校验。如果用户名或密码为空,弹出提示信息;如果用户名或密码不正确,也弹出相应的提示信息;如果用户名和密码都正确,弹出登录成功的提示信息。同时,我们在 `login()` 函数中使用了 `return` 语句控制了表单的提交行为。
用qt实现用户名输入框、密码输入框、登录和取消按钮的源代码
以下是用Qt实现用户名输入框、密码输入框、登录和取消按钮的源代码:
```cpp
#include <QtWidgets>
int main(int argc, char *argv[])
{
QApplication app(argc, argv);
// 创建主窗口
QWidget *mainWindow = new QWidget;
mainWindow->setWindowTitle("登录");
// 创建用户名输入框
QLabel *userLabel = new QLabel("用户名:");
QLineEdit *userEdit = new QLineEdit;
// 创建密码输入框
QLabel *passwordLabel = new QLabel("密码:");
QLineEdit *passwordEdit = new QLineEdit;
passwordEdit->setEchoMode(QLineEdit::Password);
// 创建登录和取消按钮
QPushButton *loginButton = new QPushButton("登录");
QPushButton *cancelButton = new QPushButton("取消");
// 创建布局
QGridLayout *layout = new QGridLayout;
layout->addWidget(userLabel, 0, 0);
layout->addWidget(userEdit, 0, 1);
layout->addWidget(passwordLabel, 1, 0);
layout->addWidget(passwordEdit, 1, 1);
layout->addWidget(loginButton, 2, 0);
layout->addWidget(cancelButton, 2, 1);
// 设置布局
mainWindow->setLayout(layout);
// 显示主窗口
mainWindow->show();
return app.exec();
}
```
希望这个代码能够帮助你实现你的需求。