麻烦大神帮帮忙,新手求帮助 正在学习js table 表里想让 第2列乘以第3列将数据打在第4列,然后让第四列做和,麻烦大神,
table表贴出来了
<table border="1px" style="width: 100%; height: 100%; border-spacing: 0rem; text-align: center;" >
<tr>
<th>评核项目</th>
<th>得分(0-100分)</th>
<th>权重</th>
<th>得分</th>
</tr>
<tr>
<td>仪表举止</td>
<td><input class="" style="width: 100%;height: 100%;border: 0px;"/></td>
<td><input class="" value="10%" readonly = "readonly"id="numb" style="width: 100%;height: 100%;border: 0px;"/> </td>
<td><input class="" id="total" readonly = "readonly" style="width: 100%;height: 100%;border: 0px;"/> </td>
</tr>
<tr>
<td>专业素质</td>
<td><input class="" style="width: 100%;height: 100%;border: 0px;"/></td>
<td><input class="" value="30%" readonly = "readonly"id="numb" style="width: 100%;height: 100%;border: 0px;"/> </td>
<td><input class="" id="total" readonly = "readonly" style="width: 100%;height: 100%;border: 0px;"/> </td>
</tr>
<tr>
<td>逻辑思维</td>
<td><input class="" style="width: 100%;height: 100%;border: 0px;"/></td>
<td><input class="" value="20%" readonly = "readonly"id="numb" style="width: 100%;height: 100%;border: 0px;"/> </td>
<td><input class="" id="total" readonly = "readonly" style="width: 100%;height: 100%;border: 0px;"/> </td>
</tr>
<tr>
<td>敬业精神</td>
<td><input class="" style="width: 100%;height: 100%;border: 0px;"/></td>
<td><input class="" value="10%" readonly = "readonly"id="numb" style="width: 100%;height: 100%;border: 0px;"/> </td>
<td><input class="" id="total" readonly = "readonly" style="width: 100%;height: 100%;border: 0px;"/> </td>
</tr>
<tr>
<td>沟通协调能力</td>
<td><input class="" style="width: 100%;height: 100%;border: 0px;"/></td>
<td><input class="" value="10%" readonly = "readonly"id="numb" style="width: 100%;height: 100%;border: 0px;"/> </td>
<td><input class="" id="total" readonly = "readonly" style="width: 100%;height: 100%;border: 0px;"/> </td>
</tr>
<tr>
<td>组织管理能力</td>
<td><input class="" style="width: 100%;height: 100%;border: 0px;"/></td>
<td><input class="" value="10%" readonly = "readonly"id="numb" style="width: 100%;height: 100%;border: 0px;"/> </td>
<td><input class="" id="total" readonly = "readonly" style="width: 100%;height: 100%;border: 0px;"/> </td>
</tr>
<tr>
<td>应变能力</td>
<td><input class="" style="width: 100%;height: 100%;border: 0px;"/></td>
<td><input class="" value="10%" readonly = "readonly"id="numb" style="width: 100%;height: 100%;border: 0px;"/> </td>
<td><input class="" id="total" readonly = "readonly" style="width: 100%;height: 100%;border: 0px;"/> </td>
</tr>
<tr>
<td>总计</td>
<td><input class="" value="—— ——" readonly = "readonly"style="width: 100%;height: 100%;border: 0px;"/></td>
<td><input class="" value="10%" readonly = "readonly"id="numb" style="width: 100%;height: 100%;border: 0px;"/> </td>
<td><input class="" id="total" readonly = "readonly" style="width: 100%;height: 100%;border: 0px;"/> </td>
</tr>
</table>
麻烦大神帮帮忙
下班了,先上代码,有什么其他问题明天再说...
((urTable)=>{
let trs = urTable.querySelectorAll('tr');
let total = urTable.querySelector('tr:last-child>td:last-child>input');
for(let k = 1,len = trs.length - 1; k<len ;k++){
let input_1 = trs[k].querySelector('td:nth-child(2)>input');
if(!input_1){
continue
}
let power = trs[k].querySelector('td:nth-child(3)>input'),
grade = trs[k].querySelector('td:nth-child(4)>input');
input_1.onchange = ()=>{
grade.value = event.target.value * parseFloat(power.value.replace('%')) / 100
trs[k].querySelector('td:nth-child(4)>input')
total.value = 0
total.value = Array.from(
urTable.querySelectorAll('tr>td:nth-child(4)>input')
).reduce((all, {value} )=>{
return all+parseFloat(value||0)
}, 0);
}
}
})(document.querySelector('table'));// 传入你的table