H5+CSS+JS工作性价比计算器
工作性价比＝平均日新x综合环境系数/35 x(工作时长＋通勤时长—0.5 x摸鱼时长) x学历系数
如果代码中的公式不对，请指正
效果图
源代码
<!DOCTYPE html>
<html>
<head>
<style>
.calculator {
width: 300px;
padding: 20px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
margin: 20px auto;
}
.calculator h2 {
margin-top: 0;
color: #008000;
}
.calculator label {
display: block;
margin-bottom: 10px;
color: #008000;
}
.calculator select {
width: 100%;
padding: 5px;
border: 1px solid #008000;
border-radius: 5px;
background-color: #e6e6e6;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}
.calculator input[type="number"] {
width: 100%;
padding: 5px;
border: 1px solid #008000;
border-radius: 5px;
background-color: #e6e6e6;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}
.calculator button {
width: 100%;
padding: 10px;
border: none;
border-radius: 5px;
background-color: #008000;
color: #fff;
font-size: 16px;
cursor: pointer;
margin-top: 10px;
}
</style>
</head>
<body>
<div class="calculator">
<h2>工作性价比计算器</h2>
<label for="salary">月薪：</label>
<input type="number" id="salary" placeholder="请输入月薪" />
<label for="workingHours">工作时长（小时）：</label>
<input type="number" id="workingHours" placeholder="请输入工作时长" />
<label for="commuteHours">通勤时长（小时）：</label>
<input type="number" id="commuteHours" placeholder="请输入通勤时长" />
<label for="slackHours">摸鱼时长（小时）：</label>
<input type="number" id="slackHours" placeholder="请输入摸鱼时长" />
<label for="workEnvironment">工作环境：</label>
<select id="workEnvironment">
<option value="1.0">普通环境</option>
<option value="0.9">偏僻地区或郊区的工厂</option>
<option value="0.8">艰苦户外等工作环境</option>
<option value="1.1">CBD、体制内等工作环境</option>
</select>
<label for="oppositeSexEnvironment">异性环境：</label>
<select id="oppositeSexEnvironment">
<option value="1.0">周围好看的异性不多不少</option>
<option value="0.9">周围没有好看异性</option>
<option value="1.1">周围很多好看异性</option>
</select>
<label for="colleagueEnvironment">同事环境：</label>
<select id="colleagueEnvironment">
<option value="1.0">周围基本上都是普通同事</option>
<option value="0.95">周围脑残同事较多</option>
<option value="1.05">周围优秀同事较多</option>
</select>
<label for="education">学历：</label>
<select id="education">
<option value="0.8">专科及以下</option>
<option value="1.0">普通本科</option>
<option value="1.2">211/985 本科</option>
<option value="1.4">普通硕士</option>
<option value="1.6">211/985 硕士</option>
<option value="1.8">普通博士</option>
<option value="2.0">211/985 博士</option>
</select>
<button οnclick="calculate()">计算性价比</button>
<p id="result"></p>
<p id="advice"></p>
</div>
<script>
function calculate() {
var salary = parseInt(document.getElementById("salary").value);
var workingHours = parseInt(document.getElementById("workingHours").value);
var commuteHours = parseInt(document.getElementById("commuteHours").value);
var slackHours = parseInt(document.getElementById("slackHours").value);
var workEnvironment = parseFloat(document.getElementById("workEnvironment").value);
var oppositeSexEnvironment = parseFloat(document.getElementById("oppositeSexEnvironment").value);
var colleagueEnvironment = parseFloat(document.getElementById("colleagueEnvironment").value);
var education = parseFloat(document.getElementById("education").value);
if (isNaN(salary) || isNaN(workingHours) || isNaN(commuteHours) || isNaN(slackHours)) {
document.getElementById("result").innerHTML = "请输入有效的数值。";
document.getElementById("advice").innerHTML = "";
return;
}
var averageDailySalary = salary / 21.75; // 假设每月工作21.75天
var comprehensiveEnvironmentFactor = workEnvironment * oppositeSexEnvironment * colleagueEnvironment;
var workDuration = workingHours + commuteHours - 0.5 * slackHours; // 考虑到摸鱼时间的影响
// 假设工作性价比的计算公式为：
// (平均日薪 * 综合环境系数) / (标准工作时长 * 工作时长系数 * 学历系数)
var standardWorkingHours = 8; // 标准工作时长为8小时
var workPerformanceRatio = (averageDailySalary * comprehensiveEnvironmentFactor) / (standardWorkingHours * workDuration * education);
document.getElementById("result").innerHTML = "工作性价比：" + workPerformanceRatio.toFixed(2);
var advice = "";
// 根据工作性价比分数给出建议
if (workPerformanceRatio < 0.5) {
advice = "工作性价比较低，建议考虑换工作或改善工作条件。";
} else if (workPerformanceRatio >= 0.5 && workPerformanceRatio < 1.0) {
advice = "工作性价比一般，可以考虑提升工作效率或寻找更好的工作机会。";
} else if (workPerformanceRatio >= 1.0 && workPerformanceRatio < 1.5) {
advice = "工作性价比良好，继续保持并寻找进一步提升的机会。";
} else if (workPerformanceRatio >= 1.5) {
advice = "工作性价比很高，继续保持并享受工作带来的回报。";
}
document.getElementById("advice").innerHTML = advice;
}
</script>
</body>
</html>