<html> <header> </header> <body> <!-- 装备清单 --> <div id="zbqd"> <table border="1" cellspacing="0" style=" border-collapse: collapse;font-size: 14px;"> <thead> <tr> <th colspan="3" height="40px;" style=" 295px;">装备清单</th> <th colspan="1" align="center" style=" 70px;"> <input type="button" id="ok" class="optInput" value="调拨" onclick="pushEq()" /> </th> </tr> </thead> <tbody id="qdtbody"> <tr> <th align='center' style=' 120px;'>装备名称</th> <th align='center'>数量</th> <th align='center' style='47px'>调拨数</th> <th align='center' style=' 156px;'>存放地址</th> </tr> <tr id="1"> <td align='center'>信号枪</td> <td align='center'>25</td> <td align='center'><input type='text' style=' 40px;height: 30px;' id='qd1' value='0' /></td> <td align='center'>西湖路</td> </tr> <tr id="2"> <td align='center'>装备包</td> <td align='center'>30</td> <td align='center'><input type='text' style=' 40px;height: 30px;' id='qd2' value='0' /></td> <td align='center'>起义路</td> </tr> <tr id="3"> <td align='center'>探测器</td> <td align='center'>12</td> <td align='center'><input type='text' style=' 40px;height: 30px;' id='qd3' value='0' /></td> <td align='center'>起义路</td> </tr> </tbody> </table> </div> <br> <div id="zdzb"> <table border="1" cellspacing="0" style=" border-collapse: collapse; 300px;"> <thead> <tr> <th colspan="4" height="40px;">战斗单元配置标准</th> </tr> </thead> <tbody id="zdzbtbody"> <tr> <th align='center' style=' 120px;'>装备名称</th> <th align='center' style='47px'>数量</th> </tr> <tr> <td align='center'>信号枪</td> <td align='center'>10</td> </tr> <tr> <td align='center'>装备包</td> <td align='center'>50</td> </tr> </tbody> </table> </div> <br> <input type="button" id="ok" class="optInput" value="确认" onclick="pushEq()" /> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <script src="demo.js"></script> </body> </html>
demo.js
function pushEq(){ // var qdtbody = document.getElementById("qdtbody"); // var qdrows = qdtbody.rows; // 用战斗装备配置的去比对 装备清单的数据 var tbody = document.getElementById("zdzbtbody"); var rows = tbody.rows; for(var i=1; i<rows.length;i++){ var cells=rows[i].cells; var a; //装备名称 var b; //战斗装备数量 for(var j=0;j<cells.length;j++){ if(j==0){ a = cells[j].innerHTML; console.log("战斗装备名称: "+a); } if(j==1){ b = cells[j].innerHTML; console.log(b); } } var qdtbody = document.getElementById("qdtbody"); var qdrows = qdtbody.rows; for(var k=1; k<qdrows.length; k++){ var qdcells=qdrows[k].cells; // 装备清单 var aa; var bb; for(var l=0;l<qdcells.length;l++){ if(l==0){ aa = qdcells[l].innerHTML; } if(l==1){ bb = qdcells[l].innerHTML; continue; } } if(a == aa && parseInt(b)<parseInt(bb)){ console.log("黄色字体表示匹配战斗单元标准并且数量满足要求"); var qd = document.getElementById(k); qd.style.color="yellow"; document.getElementById("qd"+k).value = b; } if(a == aa && parseInt(b)>parseInt(bb)){ console.log("蓝色字体表示在战斗单元配置中但是框定的范围里面没有该装备"); var qd = document.getElementById(k); qd.style.color="blue"; document.getElementById("qd"+k).value = b; } aa=""; bb=""; } a=""; b=""; } }