前情提要:
需求是如果“与员工关系”为本人时,后面的归属人信息不需要写,为了省去后台的验证操作,可直接在页面进行处理。
遇到的问题:当选择“与员工关系”时(下拉框),要给一个事件,将后面的字段设置为禁用。但是不知道应该给什么事件,或者是给谁一个事件。
html代码:(后面重复代码省略)
<div class="row form-layout">
<div class="col-md-2 form-name ">
<span style="color: red">*</span> 与员工关系:
</div>
<div class="col-md-2 form-select" id='relationWithEmpLi'>
<input id="relationWithEmp" name="relationWithEmp" type="text" data-value="${serviceObj.relationWithEmp}" readonly="readonly"/>
</div>
<div class="col-md-2 form-name">
<span style="color: red"></span> 归属人姓名:
</div>
<div class="col-md-2 form-input">
<input id="ownerName" name="ownerName" type="text" value=""/>
</div>
<div class="col-md-2 form-name ">
<span style="color: red"></span> 归属人企业简称:
</div>
<div class="col-md-2 form-input">
<input id="ownerEnterpriseAbbreviation" name="ownerEnterpriseAbbreviation" type="text" value=""/>
</div>
</div>
后来经过前端同事的提醒,知道了应该给谁什么事件。
因为“与员工关系”为下拉框,我们点击时是对ul的li进行的操作,所以应该是给li一个点击事件即可。
js代码如下:
$("#relationWithEmpLi .select_ul li").click(function(){
//$("#signupForm input[name='relationWithEmp']").attr('data-value',"");
var valueCheckBox = $(this).attr('data-value');
if(valueCheckBox == '01'){
$("#signupForm input[name='ownerEmployeeIdType']").attr('data-value',"");
$("#signupForm input[name='ownerEmployeeIdType']").val("");
$("#ownerName").val("");
$("#ownerEnterpriseAbbreviation").val("");
$("#ownerEmployeeNum").val("");
$("#ownerEmployeeIdNum").val("");
$("#signupForm input[name='ownerEmployeeIdType']").attr('disabled',true);
$("input[name='ownerName']").attr('disabled',true);
$("input[name='ownerEnterpriseAbbreviation']").attr('disabled',true);
$("input[name='ownerEmployeeNum']").attr('disabled',true);
$("input[name='ownerEmployeeIdNum']").attr('disabled',true);
}else{
$("#signupForm input[name='ownerEmployeeIdType']").attr('disabled',false);
$("input[name='ownerName']").attr('disabled',false);
$("input[name='ownerEnterpriseAbbreviation']").attr('disabled',false);
$("input[name='ownerEmployeeNum']").attr('disabled',false);
$("input[name='ownerEmployeeIdNum']").attr('disabled',false);
}
});