如何用jQuery从CSHTML foreach循环取值并为员工评估系统分配变量？

嘿，我来帮你搞定这个分值分配的事儿！其实核心思路就是先给每个评分项加个可识别的标记，再用JavaScript把对应分值捞出来存到变量里，下面给你具体的实现方案：

第一步：给评分元素加唯一标识 #

首先得让每个题目的评分结果能被JS精准找到，最简单的方式是给每个评分对应的隐藏输入框（或者星星组件的容器）加个专属ID。比如你的HTML可以改成这样：

<h4>Score Ola using our rating form below.</h4>
<p>Job Title: Nanny</p>
<p style="color: red; font-size: 12px;"> Note: Questions are selected ba...</p>

<!-- 题目1的评分区域 -->
<div class="question-item">
  <p>1. 题目内容1</p>
  <!-- 假设星星评分组件会把选中的分值存在这个隐藏input里 -->
  <input type="hidden" id="score-1" value="2">
</div>

<!-- 题目2的评分区域 -->
<div class="question-item">
  <p>2. 题目内容2</p>
  <input type="hidden" id="score-2" value="3">
</div>

<!-- 剩下8道题以此类推，id对应score-3到score-10 -->

第二步：用JS获取分值并赋值给变量 #

接下来就可以用JavaScript把每个分值取出来，赋值给你需要的questionOne、questionTwo这类变量了：

基础版（一次性获取所有分值） #

// 逐个获取每个题目的分值，转成数字类型
const questionOne = parseInt(document.getElementById('score-1').value);
const questionTwo = parseInt(document.getElementById('score-2').value);
const questionThree = parseInt(document.getElementById('score-3').value);
// ... 一直写到questionTen
const questionTen = parseInt(document.getElementById('score-10').value);

// 可以打印测试一下是否正确
console.log("题目1得分：", questionOne);
console.log("题目2得分：", questionTwo);

进阶版（实时更新分值） #

如果你的星星评分是点击后实时变化的，那可以监听分值变化事件，实时更新变量：

// 先定义一个对象来存所有分值（比单独变量更易管理）
const employeeScores = {};

// 监听所有评分输入框的变化
document.querySelectorAll('[id^="score-"]').forEach(input => {
  // 初始化时先把值存进去
  const questionNum = input.id.split('-')[1];
  employeeScores[`question${questionNum.charAt(0).toUpperCase() + questionNum.slice(1)}`] = parseInt(input.value);

  // 点击星星后实时更新
  input.addEventListener('change', function() {
    const questionNum = this.id.split('-')[1];
    employeeScores[`question${questionNum.charAt(0).toUpperCase() + questionNum.slice(1)}`] = parseInt(this.value);
    
    // 测试实时更新效果
    console.log(`题目${questionNum}最新得分：`, employeeScores[`question${questionNum.charAt(0).toUpperCase() + questionNum.slice(1)}`]);
  });
});

// 访问的时候直接用employeeScores.questionOne就可以啦

特殊情况（没有隐藏输入框） #

如果你的星星组件没有用隐藏input存分值，而是靠选中的星星数量来判断，那可以这样获取：

// 假设每个题目下的选中星星有个active类
const questionOne = document.querySelectorAll('#question-1 .star.active').length;
const questionTwo = document.querySelectorAll('#question-2 .star.active').length;
// ... 以此类推

小建议 #

其实用一个对象（比如上面的employeeScores）来存储所有分值会比单独定义10个变量更灵活，后续计算总分、提交数据的时候也更方便哦！

内容的提问来源于stack exchange，提问作者user8107351