问题描述
- js，onchange时间做的“随写随算”的功能代码
-
下面是我通过js，onchange时间做的“随写随算”的功能代码，就是比如我改变净重，那么金额也会变化。但是在这个页面那些被计算出来的是不可编辑的，我之前把他们设置的是readonly="true",但是这样可以被鼠标点进去，容易造成后退，后来把他们设置成了disabled="true"，但是这样设置之后，这些算出来的数值就保存不了了，求大神帮忙解决下，我希望能得到readonly="true"情况下，鼠标不能选中的方法，或者disabled="true"能保存的方法，或者其他的方法，在线等，求求各位大神啦<%@page contentType="text/html; charset=UTF-8" import="java.util.*" %> <%@ taglib prefix="s" uri="/struts-tags" %> <%@ page import="com.sysgrrj.common.TypeChange" %> <html> <head> <jsp:include page='/res/inc/inc.jsp' flush='true'/> <script type="text/javascript"> function setjingZhong() { var jz= document.getElementById("ruKu.maoZhong").value- document.getElementById("ruKu.piZhong").value document.getElementById("ruKu.jingZhong").value=jz.toFixed(2); var sjzl= jz- document.getElementById("ruKu.xianChangKouZhong").value document.getElementById("ruKu.shiJiZongLiang").value=sjzl.toFixed(2); var jine=sjzl*document.getElementById("ruKu.danJia").value document.getElementById("ruKu.jinE").value=jine.toFixed(2); var daikouxiefei= sjzl* document.getElementById("dkxf").value document.getElementById("ruKu.daiKouXieFei").value=daikouxiefei.toFixed(2); var shijijine= document.getElementById("ruKu.danJia").value* sjzl+eval(document.getElementById("ruKu.daiKouXieFei").value) document.getElementById("ruKu.shiJiJinE").value=shijijine.toFixed(2); var daxiejine=shijijine; document.getElementById("ruKu.daXieJinE").value=daxiejine.toFixed(2); } function setshuiFen(){ var shuifen= document.getElementById("ruKu.shuiFen").value; var danjia; var slmin =document.getElementById("slzx").value; var slmax=document.getElementById("slzd").value ; var slbiaozhun=document.getElementById("sljc").value; var slbiaozhunjia=document.getElementById("sljcdj").value; var sljiagebodong=document.getElementById("slbhz").value; var glmin =document.getElementById("glzx").value; var glmax=document.getElementById("glzd").value ; var glbiaozhun=document.getElementById("gljc").value; var glbiaozhunjia=document.getElementById("gljcdj").value; var gljiagebodong=document.getElementById("glbhz").value; if(parseFloat(shuifen)>=parseFloat(slmin)&&parseFloat(shuifen)<=parseFloat(slmax)){ danjia =slbiaozhunjia- (shuifen-slbiaozhun)*sljiagebodong; document.getElementById("ruKu.danJia").value=danjia.toFixed(2); } else if(parseFloat(shuifen)>=parseFloat(glmin)&&parseFloat(shuifen)<=glmax ){ danjia =glbiaozhunjia- (shuifen-glbiaozhun)*gljiagebodong; document.getElementById("ruKu.danJia").value=danjia.toFixed(2); } else{alert("水分在"+glmin+"—"+glmax+"或"+slmin+"—"+slmax+"之间")} var zongjine=0; var sjzl= document.getElementById("ruKu.jingZhong").value- document.getElementById("ruKu.xianChangKouZhong").value document.getElementById("ruKu.shiJiZongLiang").value=sjzl; var jine=sjzl*document.getElementById("ruKu.danJia").value document.getElementById("ruKu.jinE").value=jine.toFixed(2); if(jine!=''){ var shijijine= danjia* sjzl+eval(document.getElementById("ruKu.daiKouXieFei").value) } if(jine==0&&document.getElementById("ruKu.daiKouXieFei").value==''){ var shijijine=0; } document.getElementById("ruKu.shiJiJinE").value=shijijine.toFixed(2); var daxiejine=shijijine; document.getElementById("ruKu.daXieJinE").value=daxiejine.toFixed(2); } </script> </head> <body> <s:form id="form1" theme="simple"> <jsp:include page='/res/inc/inc_form_Edit.jsp' flush='true'/> <div class="buttonDiv"> <s:submit theme="simple" value="保存" action="Save" cssClass="button_style" /> <s:if test="ruKu.id>0"> <s:submit theme="simple" name="Delete" value="删除" onclick="{if(confirm('确定删除纪录吗?')){this.document.formname.submit();return true;}return false;}" action="Delete" cssClass="button_style" method="dele"/> </s:if> <input type="button" class="button_style" value="返回" onclick="javascript:window.location.href='./List.action?pageLink=<s:property value="pager.pageLinkUrl"/>'"/> <input type="button" onclick="window.open ('./Print.action?id=<s:property value="ruKu.id"/>&a=<%=Math.random()%>', 'newwindow', 'height=400, width=750, top=0,left=0, toolbar=no, menubar=no, scrollbars=no, resizable=yes,location=no, status=no') " name="print" value="打印" class="button_style" /> </div> <div class="validatemsg"> <s:actionerror/> <s:fielderror/> <s:actionmessage/> </div> <table width="100%" class="listext" id="table1"> <tr> <TH colspan="4" style="background: #EBEBEB;height: 35px"> 入库管理</TH> </tr> <TR> <TH align="right" width='20%'> 单价:</TH> <TD align="left" class="tdStyle" > <s:if test="ruKu.id>0"> <s:textfield name="ruKu.danJia" disabled="true" onchange="setjingZhong()" size="30"/> (元) </s:if> <s:else> <s:textfield name="ruKu.danJia" disabled="true" onchange="setjingZhong()" size="30"/> (元) </s:else> </TD> <TH align="right" width='20%'> 净重:</TH> <TD align="left" class="tdStyle" > <s:if test="ruKu.id>0"> <s:textfield name="ruKu.jingZhong" onchange="setjingZhong()" disabled="true" size="30"/> (kg) </s:if> <s:else> <s:textfield name="ruKu.jingZhong" onchange="setjingZhong()" disabled="true" size="30"/> (kg) </s:else> </TD> </TR> <TR> <TH align="right" width='20%'> 实际重量:</TH> <TD align="left" class="tdStyle" > <s:if test="ruKu.id>0"> <s:textfield name="ruKu.shiJiZongLiang" onchange="setjingZhong()" disabled="true" size="30"/> (kg) </s:if> <s:else> <s:textfield name="ruKu.shiJiZongLiang" onchange="setjingZhong()" disabled="true" size="30"/> (kg) </s:else> </TD> <TH align="right" width='20%'> 金额:</TH> <TD align="left" class="tdStyle" > <s:if test="ruKu.id>0"> <s:textfield name="ruKu.jinE" disabled="true" size="30" onchange="setjingZhong()"/> (元) </s:if> <s:else> <s:textfield name="ruKu.jinE" disabled="true" size="30" onchange="setjingZhong()"/> (元) </s:else> </TD> </TR> <TR> <TH align="right" width='20%'> 代扣卸费:</TH> <TD align="left" class="tdStyle" > <s:if test="ruKu.id>0"> <s:textfield name="ruKu.daiKouXieFei" disabled="true" size="30"/> (元) </s:if> <s:else> <s:textfield name="ruKu.daiKouXieFei" disabled="true" size="30"/> (元) </s:else> </TD> <TH align="right" width='20%'> 实际金额:</TH> <TD align="left" class="tdStyle" > <s:if test="ruKu.id>0"> <s:textfield name="ruKu.shiJiJinE" disabled="true" size="30"/> (元) </s:if> <s:else> <s:textfield name="ruKu.shiJiJinE" disabled="true" size="30"/> (元) </s:else> </TD> </TR> <TR> <TH align="right" width='20%'> 备注:</TH> <TD align="left" class="tdStyle" colspan="3"> <s:textarea rows="6" cols="80" name="ruKu.beiZhu"/> </TD> </TR> <s:hidden name="ruKu.daXieJinE" /> </TABLE> <s:if test="ruKu.id>0"> <s:hidden name="ruKu.id"/> </s:if> <s:else> <s:hidden name="ruKu.id" value="0"/> </s:else> <s:hidden name="dkxf" id="dkxf" /> <s:hidden name="slzd" id="slzd" /> <s:hidden name="slzx" id="slzx" /> <s:hidden name="sljc" id="sljc" /> <s:hidden name="sljcdj" id="sljcdj" /> <s:hidden name="slbhz" id="slbhz" /> <s:hidden name="glzd" id="glzd" /> <s:hidden name="glzx" id="glzx" /> <s:hidden name="gljc" id="gljc" /> <s:hidden name="gljcdj" id="gljcdj" /> <s:hidden name="glbhz" id="glbhz" /> </s:form> </body> </html>
解决方案
不知道能不能使用label
解决方案二：
用label,span什么做容器显示，同时hidden存储总价。不过建议你总价服务器端通过商品单价和数量重新计算以便，而不是单靠客户端js计算的，要不客户端不支持js或者别人用开发工具直接修改你dom对象的值那就造成数据不一致了
解决方案三：
写两个，一个显示，一个不显示，每次计算结果赋值给这两个框，取值的时候从隐藏的那个框取
解决方案四：
写disabled="true"，然后再写一个隐藏域存它的值，用隐藏域向后台传值
时间： 2024-03-24 06:09:57