当前时间:2021年4月21日星期三 10:32(
动态变化的时间)
早上好:(随时间变化的提示语)
文本校验框
姓名:(判断不为空)
密码:随机生成8位密码
性别:
(默认选择自己的性别)
年龄:(判断必须是数字)
所在城市:下来菜单
爱好:4个以上选项(多选)
提交按钮 重置按钮(点提交按钮后出现拼接
提示,如:张三 您好,您的密码是x,您的
所在城市为x,年龄是20,您的爱好是x
x, x*。)
请提交两张图片,以图片形式插入,一张效
基于new bing 加以修改的编写,你直接复制代码就可以用:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单</title>
<style>
#container {
width: 800px;
margin: auto;
text-align: center;
}
form {
text-align: left;
}
</style>
</head>
<body>
<div id="container">
<h1><span id="current-time"></span><span id="greetings"></span></h1>
<form id="my-form">
<label for="name">姓名:</label>
<input type="text" id="name" name="name" required><br><br>
<label for="password">密码:</label>
<input type="text" id="password" name="password"><br><br>
<label for="gender">性别:</label>
<input type="radio" id="male" name="gender" value="male" checked><label for="male">男</label>
<input type="radio" id="female" name="gender" value="female"><label for="female">女</label><br><br>
<label for="age">年龄:</label>
<input type="number" id="age" name="age" min="1" required><br><br>
<label for="city">所在城市:</label>
<select id="city" name="city">
<option value="beijing">北京</option>
<option value="shanghai">上海</option>
<option value="guangzhou">广州</option>
<option value="shenzhen">深圳</option>
</select><br><br>
<label for="hobbies">爱好:</label>
<input type="checkbox" id="hobby1" name="hobbies" value="reading"><label for="hobby1">阅读</label>
<input type="checkbox" id="hobby2" name="hobbies" value="sports"><label for="hobby2">运动</label>
<input type="checkbox" id="hobby3" name="hobbies" value="music"><label for="hobby3">音乐</label>
<input type="checkbox" id="hobby4" name="hobbies" value="traveling"><label for="hobby4">旅游</label>
<input type="checkbox" id="hobby5" name="hobbies" value="photography"><label for="hobby5">摄影</label><br><br>
<input type="submit" value="提交">
<input type="reset" value="重置">
</form>
</div>
<script>
// 获取当前时间
function getCurrentTime() {
const now = new Date();
const year = now.getFullYear();
const month = now.getMonth() + 1;
const date = now.getDate();
const day = now.getDay();
const hours = now.getHours();
const minutes = now.getMinutes();
const seconds = now.getSeconds();
let dayText;
switch (day) {
case 0:
dayText = "星期日";
break;
case 1:
dayText = "星期一";
break;
case 2:
dayText = "星期二";
break;
case 3:
dayText = "星期三";
break;
case 4:
dayText = "星期四";
break;
case 5:
dayText = "星期五";
break;
default:
dayText = "星期六";
break;
}
return `${year}年${month}月${date}日${dayText} ${hours}:${minutes}:${seconds}`;
}
// 获取问候语
function getGreetings() {
const now = new Date();
const hours = now.getHours();
if (hours >= 6 && hours < 12) {
return "早上好!";
} else if (hours >= 12 && hours < 18) {
return "下午好!";
} else if (hours >= 18 && hours < 24) {
return "晚上好!";
} else {
return "您好!";
}
}
// 生成随机密码
function generatePassword() {
let password = "";
const characters = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
for (let i = 0; i < 8; i++) {
password += characters.charAt(Math.floor(Math.random() * characters.length));
}
return password;
}
// 获取用户输入并拼接提示信息
function getPrompt() {
const name = document.getElementById("name").value.trim();
const password = generatePassword();
const gender = document.querySelector('input[name="gender"]:checked').value;
const age = Number(document.getElementById("age").value.trim());
const city = document.getElementById("city").value;
const hobbies = [];
document.querySelectorAll('input[name="hobbies"]:checked').forEach(element => hobbies.push(element.value));
const hobbiesText = hobbies.join("、");
const prompt = `${name}您好,您的密码是${password},您的所在城市为${city},年龄是${age},您的爱好是${hobbiesText}。`;
return prompt;
}
// 在页面加载完成后初始化
window.onload = function() {
// 更新当前时间和问候语
const currentTimeSpan = document.getElementById("current-time");
currentTimeSpan.innerHTML = getCurrentTime();
setInterval(() => {
currentTimeSpan.innerHTML = getCurrentTime();
}, 1000);
document.getElementById("greetings").innerHTML = getGreetings();
// 绑定表单提交事件
const form = document.getElementById("my-form");
form.addEventListener("submit", function(event) {
event.preventDefault();
alert(getPrompt());
});
// 绑定重置按钮点击事件
const resetButton = document.querySelector('input[type="reset"]');
resetButton.addEventListener("click", function() {
document.getElementById("name").focus();
});
}
</script>
</body>
</html>
这个不是跟前两天js一样的吗。你可以先写一点html给我们,js我们来弄
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>表单提交</title>
<script type="text/javascript">
function checkForm() {
var name = document.getElementById("name").value;
var password = Math.random().toString(36).substring(2, 10);
var gender = document.querySelector('input[name="gender"]:checked').value;
var age = document.getElementById("age").value;
var city = document.getElementById("city").value;
var hobby = "";
var checkboxes = document.querySelectorAll('input[name="hobby"]:checked');
for (var i = 0; i < checkboxes.length; i++) {
hobby += checkboxes[i].value + ",";
}
hobby = hobby.substring(0, hobby.length - 1);
var message = name + " 您好,您的密码是 " + password + ",您的所在城市为 " + city + ",年龄是 " + age + ",您的爱好是 " + hobby + "。";
alert(message);
return false;
}
function updateTime() {
var now = new Date();
var hour = now.getHours();
var minute = now.getMinutes();
var second = now.getSeconds();
var time = hour + ":" + minute + ":" + second;
document.getElementById("time").innerHTML = time;
if (hour < 12) {
document.getElementById("greeting").innerHTML = "早上好:";
} else if (hour < 18) {
document.getElementById("greeting").innerHTML = "下午好:";
} else {
document.getElementById("greeting").innerHTML = "晚上好:";
}
}
setInterval(updateTime, 1000);
</script>
</head>
<body>
<p>当前时间:<span id="time"></span></p>
<p id="greeting"></p>
<form onsubmit="return checkForm()">
<label for="name">姓名:</label>
<input type="text" id="name" name="name" required>
<label for="password">密码:</label>
<input type="text" id="password" name="password" readonly>
<label for="gender">性别:</label>
<input type="radio" id="male" name="gender" value="男" checked>
<label for="male">男</label>
<input type="radio" id="female" name="gender" value="女">
<label for="female">女</label>
<label for="age">年龄:</label>
<input type="number" id="age" name="age" required>
<label for="city">所在城市:</label>
<select id="city" name="city">
<option value="北京">北京</option>
<option value="上海">上海</option>
<option value="广州">广州</option>
<option value="深圳">深圳</option>
</select>
<label for="hobby">爱好:</label>
<input type="checkbox" id="hobby1" name="hobby" value="游泳">
<label for="hobby1">游泳</label>
<input type="checkbox" id="hobby2" name="hobby" value="跑步">
<label for="hobby2">跑步</label>
<input type="checkbox" id="hobby3" name="hobby" value="旅游">
<label for="hobby3">旅游</label>
<input type="checkbox" id="hobby4" name="hobby" value="唱歌">
<label for="hobby4">唱歌</label>
<input type="submit" value="提交">
<input type="reset" value="重置">
</form>
</body>
</html>
基础技术就是HTML+css+JavaScript
建议先简单画出页面,校验等等先不用实现,把基础的界面写出来,然后再一步一步进行各个控件的实现
这有啥不会的,直接上代码,你复制到html文件中,运行试试:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Javascript第一次作业</title>
<style>
* {
box-sizing: border-box;
}
.header, .footer {
width: 100%;
background: gray;
}
.content {
width: 80%;
margin: 0 auto;
}
</style>
</head>
<body>
<div id="time"></div>
<header class="header"></header>
<div class="content">
<p>你好!</p>
<form>
<p>姓名:<input type="text" name="name" required></p>
<p>密码:<input type="text" id="pwd"></p>
<p>性别:
<label><input type="radio" name="gender" value="male" checked> 男</label>
<label><input type="radio" name="gender" value="female"> 女</label>
</p>
<p>年龄:<input type="number" name="age" required></p>
<p>所在城市:
<select name="city">
<option value="1">北京</option>
<option value="2">上海</option>
<option value="3">广州</option>
<option value="4">深圳</option>
</select>
</p>
<p>爱好:
<input type="checkbox" name="hobby" value="运动" checked> 运动
<input type="checkbox" name="hobby" value="音乐"> 音乐
<input type="checkbox" name="hobby" value="旅游"> 旅游
<input type="checkbox" name="hobby" value="阅读"> 阅读
</p>
<div>
<input type="submit" value="提交">
<input type="reset" value="重置">
</div>
</form>
</div>
<p></p>
<footer class="footer"></footer>
</body>
<script>
function getTime(){
var now = new Date();
var week = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
var ampm = ["上午", "下午"];
var ampmHour = now.getHours() ;
var ampmCheck= ampmHour >= 12 ? "下午" : "上午";
return "当前时间:" + now.getFullYear() + "年" + (now.getMonth() + 1) + "月"
+ now.getDate() + "日 "
+ ampmCheck + " "
+ now.getHours() + ":"
+ now.getMinutes();
}
setInterval(function(){
document.getElementById("time").innerHTML = getTime();
}, 1000);
let greetText = document.querySelector('p');
function setGreetText() {
let now = new Date();
let hour = now.getHours();
if (hour < 11) {
greetText.innerHTML = '早上好';
} else if (hour < 15) {
greetText.innerHTML = '中午好';
} else if (hour < 19) {
greetText.innerHTML = '下午好';
} else {
greetText.innerHTML = '晚上好';
}
}
setInterval(setGreetText, 1000);
// 重置按钮点击事件
let resetBtn = document.querySelector('input[type="reset"]');
resetBtn.addEventListener('click', function() {
alert('重置成功!');
document.querySelector('form').reset();
});
// 提交按钮点击事件
let submitBtn = document.querySelector('input[type="submit"]');
submitBtn.addEventListener('click', function() {
let name = document.querySelector('input[name="name"]').value;
let pwd = document.querySelector('input[id="pwd"]').value;
let city = document.querySelector('select[name="city"]').value;
let age = document.querySelector('input[name="age"]').value;
let hobbies = [];
document.querySelectorAll('input[name="hobby"]:checked').forEach(item => {
hobbies.push(item.value);
});
let hobbyStr = hobbies.join('、');
let greetText = `${name} 您好,您的密码是${pwd},您的所在城市是${city},年龄是${age},您的爱好是${hobbyStr}。`;
alert(greetText);
});
let nameInput = document.querySelector('input[name="name"]');
let pwdInput = document.querySelector('input[id="pwd"]');
nameInput.addEventListener('change', function() {
pwdInput.value = Math.random().toString().slice(2, 10);
});
</script>
</html>
如果可以,请直接采纳,如果有需要修改的地方,可以直接联系我改就行。
基本思路是:构造指标-计算各指标的权重-TOPSIS法进行评价
为了有效凸显出五年来帮扶单位在脱贫攻坚提升方面所作出的努力,计算了各指标的增长率,即
2020_SR/2015_SR,2020_CY/2015_CY,……,2020_ZF/2015_ZF
主成分分析法是一种线性无监督的降维方法,可以通过主成分分析法计算各指标方差贡献率,以此作为各指标的权重。接着采用TOPSIS法进行评价,TOPSIS法是一种常用的组内综合评价方法,能充分利用原始数据的信息,其结果能精确地反映各评价方案之间的差距。基本过程为基于归一化后的原始数据矩阵,采用余弦法找出有限方案中的最优方案和最劣方案,然后分别计算各评价对象与最优方案和最劣方案间的距离,获得各评价对象与最优方案的相对接近程度,以此作为评价优劣的依据。该方法对数据分布及样本含量没有严格限制,数据计算简单易行。
#构造评价指标
data_2 = pd.DataFrame(data.pivot_table(index=['帮扶单位(0-159)','村庄编号','帮扶单位类型(0-5)'],values=columns)).reset_index()
for j in range(6):
data_2['{}_增长率'.format(j)] = data_2.iloc[:,9+j]/data_2.iloc[:,j+3]
data_2 = data_2.drop(['帮扶单位(0-159)','村庄编号','帮扶单位类型(0-5)'],axis=1).drop(columns,axis=1)
c = ['CY_增长率','HJ_增长率','SR_增长率','SS_增长率','WJ_增长率','ZF_增长率']
data_2.columns = c
# 数据归一化
def Standard(data):
return (data - data.min())/(data.max()-data.min())
data_2 = Standard(data_2)
# PCA计算指标权重
from sklearn.decomposition import PCA
from sklearn import preprocessing
pca = PCA(n_components=6)
pca.fit_transform(data_2)
weight = pca.explained_variance_ratio_ #方差贡献率
print(weight)
def topsis(data, weight):
# 最优最劣方案
Z = pd.DataFrame([data.min(), data.max()], index=['负理想解', '正理想解'])
# 距离
Result = data.copy()
Result['正理想解'] = np.sqrt(((data - Z.loc['正理想解']) ** 2 * weight).sum(axis=1))
Result['负理想解'] = np.sqrt(((data - Z.loc['负理想解']) ** 2 * weight).sum(axis=1))
# 综合得分指数
Result['综合得分指数'] = Result['负理想解'] / (Result['负理想解'] + Result['正理想解'])
Result['排序'] = Result.rank(ascending=False)['综合得分指数']
return Result
results = topsis(data_2,weight)
results['帮扶单位(0-159)'] = data['帮扶单位(0-159)']
results['帮扶单位类型(0-5)'] = data['帮扶单位类型(0-5)']
results.sort_values(by='排序').head(10)
我可以提供此问题的具体解决方案。
使用JavaScript编写时间动态刷新的代码,将其插入到HTML页面的合适位置即可。
setInterval(function() {
var now = new Date();
var date = now.toLocaleDateString();
var time = now.toLocaleTimeString();
document.getElementById('current-time').innerHTML = date + ' ' + time;
}, 1000);
在表单中添加一个文本框并为其设置"required"属性。
<label for="name">姓名:</label>
<input type="text" id="name" name="name" required>
使用Python中的random模块和字符串函数生成8位随机密码,将其显示在表单的密码框中。
import random
import string
password = ''.join(random.choices(string.ascii_letters + string.digits, k=8))
print(password)
# 在HTML页面中
<input type="password" id="password" name="password" value="{}">
使用单选框或下拉菜单将选项以键值对的形式显示,其中默认选项为当前用户的性别。
<label>性别:</label>
<input type="radio" id="male" name="gender" value="male"{{ 'checked' if gender == 'male' else '' }}>
<label for="male">男</label>
<input type="radio" id="female" name="gender" value="female"{{ 'checked' if gender == 'female' else '' }}>
<label for="female">女</label>
使用数字框并使用"min"和"max"属性限制年龄范围。
<label for="age">年龄:</label>
<input type="number" id="age" name="age" min="1" max="120">
使用下拉菜单以选项的形式显示城市列表。
<label for="city">所在城市:</label>
<select id="city" name="city">
{% for city in cities %}
<option value="{{ city }}"{{ ' selected' if city == user.city else '' }}>{{ city }}</option>
{% endfor %}
</select>
使用复选框以选项的形式显示爱好列表。
<label>爱好:</label><br>
{% for hobby in hobbies %}
<input type="checkbox" id="{{ hobby }}" name="hobbies[]" value="{{ hobby }}"{{ ' checked' if hobby in user.hobbies else '' }}>
<label for="{{ hobby }}">{{ hobby }}</label><br>
{% endfor %}
使用表单的submit和reset按钮。
<button type="submit">提交</button>
<button type="reset">重置</button>
使用Python编写处理表单提交的代码,将用户信息和提示信息拼接到HTML页面中。
from flask import Flask, request, render_template
app = Flask(__name__)
@app.route('/submit', methods=['POST'])
def submit():
name = request.form['name']
password = request.form['password']
gender = request.form['gender']
age = request.form['age']
city = request.form['city']
hobbies = request.form.getlist('hobbies')
message = '提交成功,您的信息为:姓名:{},密码:{},性别:{},年龄:{},所在城市:{},爱好:{}'.format(
name, password, gender, age, city, ','.join(hobbies))
return render_template('submit.html', message=message)
使用HTML页面的"enctype"属性和Flask的"request.files"对象实现文件上传。
<form action="{{ url_for('submit') }}" method="POST" enctype="multipart/form-data">
<input type="file" name="file1"><br>
<input type="file" name="file2"><br>
</form>
@app.route('/submit', methods=['POST'])
def submit():
file1 = request.files['file1']
file2 = request.files['file2']
# 处理文件上传
# ...
html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1 id="clock"></h1>
<button onclick="startClock()">打开时钟</button>
<button onclick="stopClock()">关闭时钟</button>
<script src="clock.js"></script>
</body>
</html>