<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/> <style type = "text/css"> body {font-size: 12px; text-align: center;} td {font-size: 12px ;}. outtab {border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: # CCCCCC; B Order-right-color: # CCCCCC; border-bottom-color: # CCCCCC; border-left-color: # CCCCCC; }# main {border: 1px solid # CCCCCC; width: 600px; height: 200px; text-align: left; padding: 10px ;}</style> <ul> <li> </li> <li> water: starting degree <input onkeydown = "CheckNum (this)" onblur = "dosum ()" style = "WIDTH: 50px "name =" s1 "/> stop <input onkeydown =" CheckNum (this) "onblur =" dosum () "style =" WIDTH: 50px "name =" s2 "/> unit price <input on Keydown = "CheckNum (this)" onblur = "dosum ()" style = "WIDTH: 50px" name = "s3"/> additional <input onkeydown = "CheckNum (this) "onblur =" dosum () "style =" WIDTH: 50px "name =" s4 "/> </li> <li> electricity: starting degree <input onkeydown = "CheckNum (this)" onblur = "dosum ()" style = "WIDTH: 50px "name =" d1 "/> stop <input onkeydown =" CheckNum (this) "onblur =" dosum () "style =" WIDTH: 50px "name =" d2 "/> unit price <input onkeydown =" CheckNum (this) "onblur =" dosum () "Style =" WIDTH: 50px "name =" d3 "/> additional <input onkeydown =" CheckNum (this) "onblur =" dosum () "style =" WIDTH: 50px "name =" d4 "/> </li> <li> gas: Starting degree <input onkeydown =" CheckNum (this) "onblur =" dosum () "style =" WIDTH: 50px "name =" q1 "/> stop <input onkeydown =" CheckNum (this) "onblur =" dosum () "style =" WIDTH: 50px "name =" q2 "/> unit price <input onkeydown =" CheckNum (this) "onblur =" dosum () "style =" WIDTH: 50px "name =" q3 "/> additional <I Nput onkeydown = "CheckNum (this)" onblur = "dosum ()" style = "WIDTH: 50px" name = "q4"/> </li> <li> description: after entering each item, click the mouse in any blank area on the page to automatically calculate the result! </Li> </ul> <table cellspacing = "0" bordercolordark = "# ffffff" cellpadding = "0" width = "646" align = "left" bordercolorlight = "# 000000 "border =" 1 "> <tbody> <tr> <td align =" center "width =" 90 "> name </td> <td align =" center "width = "90"> starting degree (ton/Degree/party) </td> <td align = "center" width = "90"> stop (ton/Degree/party) </td> <td align = "center" width = "90"> quantity (tons/Degree/party) </td> <td align = "center" width = "90"> unit price (RMB) </td> <td align = "center" width = "90"> additional amount (RMB) </td> <td align = "center" width = "90"> total amount (RMB) </td> </tr> <td align = "center"> water </td> <td id = "a1" align = "right"> </td> <td id = "a2" align = "right"> </td> <td id = "a3" align = "right"> </td> <td id =" a4 "align =" right "> </td> <td id =" a5 "align =" right "> </td> <td id =" a6 "align =" right "> </td> </tr> <td align =" center "> electricity </td> <td id =" b1 "align =" right "> </td> <td id = "b2" align = "right"> </td> <td id = "b3" align = "right"> </td> <td id = "b4" align = "right"> </td> <td id = "b5" align = "right"> </td> <td id = "b6" align = "right"> </td> </tr> <td align = "center"> gas </td> <td id = "c1" align = "right"> </td> <td id = "c2" align = "right"> </td> <td id = "c3" align = "right"> </td> <td id = "c4" align = "right"> </td> <td id = "c5" align = "right"> </td> <td id = "c6" align = "right"> </td> </tr> <td align = "left" colspan = "6"> total (RMB) </td> <td id = "hj" align = "right"> </td> </tr> </tbody> </table>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]