JSP中input内容改变触发onchange事件使⽤
最近做的⼀个成绩的⽐例添加的功能,需求是平时⽐例和期末⽐例为100%,⽽为了减少让⽤户的思考,让界⾯更⼈性
化,其实我们可以在输⼊平时⽐例时,期末⽐例⾃动加载,这时就要使⽤jsp中input的内容改变需要触发的⼀个事件:
onchange()。
效果图:
JSP中input定义:
<!-- 添加⽐例设置表单------>
<div id="addResultRule" class="easyui-dialog" title="添加成绩⽐例信息" buttons="#dlg-buttons" data-options="resizable:true,mo  <form id="fmResultRule" method="post" novalidate>
<div class="fitem" >
<label >学年:</label> <input class="easyui-combobox" id="schoolcalendarId" name="schoolcalendarId"    </div>
<div class="fitem" >
<label for="name"  >课程名称:</label> <input class="easyui-combobox" required="true" id="courseId" na    </div>
<div class="fitem" >
<label for="name"  >教师:</label> <input class="easyui-combobox" id="teacherId" name="teacherId" req    </div>
<div class="fitem" >
<label for="name" >平时成绩⽐例:</label>  <input id="dailyResultRule"  οnchange="<span >changeR          </div>
<div class="fitem" >
<label for="name"  >期末成绩⽐例:</label> <input id="finalResultRule" <span > read    </div>
</form>
</div>
<div id="dlg-buttons">
<a href="javascript:void(1)" class="easyui-linkbutton" iconCls="icon-ok" οnclick="saveAdd()" >确认</a>margin rate
<a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" οnclick="javascript:$('#addResultRule').dialog('close')" style="width:90px; margin-left: </div>
JS中函数定义:
/**
* <span >显⽰</span><span >期末⽐例</span> */
function <span >changeRule()</span>{
var dailyResult=ElementById('dailyResultRule')).value ;//获得dailyResultRule控件的值
var  r  = /^[0-9]*[1-9][0-9]*$/;
if (r.test(dailyResult) == false) {
alert("请输⼊100以内的正整数!")
return false;
} else{
if(Number(dailyResult)>100){
alert("百分⽐不能⼤于100!")
return false;
}
}
var dailyRate = dailyResult + "%";//平时⽐例
var finalResultRate=eval(100-Number(dailyResult));//计算期末⽐例
var finalRate=finalResultRate+ "%";//期末⽐例
}

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。