首先看看我们的页面结构是这样的 carbodyguainfoForm下面包含了一个table ,我们的目的想获取input框里面的值并进行累加计算得出结果
<form action="" name="carbodyguainfoForm" id="carbodyguainfoForm">
<table style="margin-top: 5px; margin-left: 5px; width: 100%;">
<tr>
<td><label class="i18n">大梁中 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="middle" id="middle"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">大梁下 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="bottom" id="bottom"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">大梁高 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="height" id="height"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
</tr>
<tr>
<td><label class="i18n">翼板上 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="yibanTop" id="yibanTop"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">翼板下 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="yibanBottom" id="yibanBottom"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">立板中 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="libanMiddle" id="libanMiddle"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
</tr>
<tr>
<td><label class="i18n">边梁 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="bianliang" id="bianliang"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">边横梁 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="bianhengliang" id="bianhengliang"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">贯穿梁 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="guanchuanliang" id="guanchuanliang"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
</tr>
<tr>
<td><label class="i18n">立柱高 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="lizhuHeight" id="lizhuHeight"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">立柱厚 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="lizhuWidth" id="lizhuWidth"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">立柱类型 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="lizhuType" id="lizhuType"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
</tr>
<tr>
<td><label class="i18n">底板 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="diBan" id="diBan"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">立柱边梁 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="lizhubianliang" id="lizhubianliang"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">上圈梁 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="quanliangTop" id="quanliangTop"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
</tr>
<tr>
<td><label class="i18n">厢板样式 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="xiangbanType" id="xiangbanType"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">花栏样式 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="hualanType" id="hualanType"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">爬梯样式 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="patiType" id="patiType"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
</tr>
<tr>
<td><label class="i18n">副车架 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="fuchejia" id="fuchejia"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">油顶 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="youding" id="youding"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
</tr>
<tr>
<td><label class="i18n">锁具 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="suoju" id="suoju"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
<td><label class="i18n">集装箱转锁 <span style="float:right;color:#FF0000">* </label></td>
<td><input name="suojuxiang" id="suojuxiang"
class="easyui-validatebox input-default input_text"
data-options="required:true" maxlength="25"/></td>
</tr>
</table>
</form>
<input type="button" value="提交分值" οnclick="buttonScore();"></input>
js代码操作:笔者在做的时候遇到发现jquery是不支持continue 也就是js中的进入下一次循环,
使用 return; 或者 return true; 来代替 continue 语句;
使用 return false; 来代替 break 语句;
function isNumber(value) { //验证是否为数字
var patrn = /^(-)?\d+(\.\d+)?$/;
if (patrn.exec(value) == null || value == "") {
return false
} else {
return true
}
}
function buttonScore(){
var inputNum=0;
$("#carbodyguainfoForm").find("table").find("td").find("input").each(function(){
if(isNumber($(this).val())){
inputNum=inputNum*1+$(this).val()*1; //数值乘以1 把他当成一个加法运算处理。
}else{
return;
}
});
}