Question

js无刷新实现textbox值相加，​前面三个textbox值相加后显示在第四个textbox中

<td colspan="3">
大箱码：<asp:TextBox ID="tbPackLayer3" runat="server" Width="60px" CssClass="tb" ></asp:TextBox> 
中盒码：<asp:TextBox ID="tbPackLayer2" runat="server" Width="60px" CssClass="tb"></asp:TextBox> 
小包码：<asp:TextBox ID="tbPackLayer1" runat="server" Width="60px" CssClass="tb"></asp:TextBox> 
总码数：<asp:TextBox ID="tbPackLayerAll" runat="server" Width="60px" CssClass="tb" ReadOnly="true"></asp:TextBox>
</td>

Answer 1

<script>
document.getEelmentByid('tbPackLayer1').value.onchange=function(){test();}
document.getEelmentByid('tbPackLayer2').value.onchange=function(){test();}
document.getEelmentByid('tbPackLayer3').value.onchange=function(){test();}

function test(){
var v1=document.getEelmentByid('tbPackLayer1').value
var v2=document.getEelmentByid('tbPackLayer2').value
var v3=document.getEelmentByid('tbPackLayer3').value
document.getEelmentByid('tbPackLayerAll').value=v1+v2+v3
}
//如果textbox不是文本框类的，就要用innterHtml来获取了。
</script>

Answer 2

window.addEventListener('load',function(){
    
    var el = function(id){ return document.getElementById(id);};
    var changeHandle = function(){  
        el('tbPackLayerAll').value = el('tbPackLayer1').value+el('tbPackLayer2').value+el('tbPackLayer3').value;
     };
    
    el('tbPackLayer1').addEventListener('change',changeHandle);
    el('tbPackLayer2').addEventListener('change',changeHandle);
    el('tbPackLayer3').addEventListener('change',changeHandle);
    
});

Answer 3

<script >
function sum(){
    var max = document.getElementById("tbPackLayer3").value;
    var zhong= document.getElementById("tbPackLayer3").value;
    var min = document.getElementById("tbPackLayer3").value;
    document.getElementById("tbPackLayer3").innerHTML= parseInt(max) + parseInt(zhong) + parseInt(min) ;
}
</script>