0
我开发了一个表单，当用户填写所有输入字段时，将会启用提交按钮。我的问题是提交按钮没有被启用。我正在使用jQuery。填写表格中的所有输入后，按钮无法使用
var UserCampusName = "0";
var EmpID = null;
var FirstName = null;
var LastName = null;
var mobileNo = null;
var EmpEmail = null;
var userRoles = "0";
$('#SubmitUserRole').attr('disabled', 'disabled');
$(function() {
$("#userRoleForm").hover(function(){
UserCampusName = $('#UserCampus').val()
EmpID = $('#UserEmpID').val()
FirstName = $('#UserEmpFirstName').val()
LastName = $('#UserEmpLastName').val()
mobileNo = $('#UserEmpMobileNo').val()
EmpEmail = $('#UserEmpEmail').val()
userRoles = $('#Roles').val()
if ((FirstName.length > 0) && (LastName.length > 0) && (mobileNo.length > 0) && (EmpEmail.length > 0) && (EmpID.length > 0) && (userRoles != 0) && (UserCampusName != 0)) {
$('#SubmitUserRole').removeAttr('disabled');
}
else {
$('#SubmitUserRole').attr('disabled', 'disabled');
}
})
})<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<form role="form" class="form-horizontal form-bordered" id="userRoleForm">
<center>
<h2>User Roles & Privileges Set-up</h2></center>
<div class="form-group">
<label class="label1 col-md-4">Select department <span class="required"> * </span> </label>
<div class="col-md-7">
<select class="form-control" id="UserCampus" data-placeholder="Select" tabindex="1">
<option value="Category 0" default disabled selected>--Select--</option>
</select>
</div>
</div>
<div class="form-group">
<label class="label1 col-md-4">Enter the employee id <span class="required"> * </span> </label>
<div class="col-md-7">
<input id="UserEmpID" type="text" class="form-control" />
</div>
</div>
<div class="form-group">
<label class="label1 col-md-4">Enter First Name <span class="required"> * </span> </label>
<div class="col-md-7">
<input id="UserEmpFirstName" type="text" class="form-control"/>
</div>
</div>
<div class="form-group">
<label class="label1 col-md-4">Enter Middle Name </label>
<div class="col-md-7">
<input id="UserEmpMiddleName" type="text" class="form-control"/>
</div>
</div>
<div class="form-group">
<label class="label1 col-md-4">Enter Last Name <span class="required"> * </span> </label>
<div class="col-md-7">
<input id="UserEmpLastName" type="text" class="form-control"/>
</div>
</div>
<div class="form-group">
<label class="label1 col-md-4">Enter Mobile Number <span class="required"> * </span> </label>
<div class="col-md-7">
<input id="UserEmpMobileNo" type="text" class="form-control allownumericwithoutdecimal"/>
</div>
</div>
<div class="form-group">
<label class="label1 col-md-4">Enter Email Id <span class="required"> * </span> </label>
<div class="col-md-7">
<input id="UserEmpEmail" type="Email" class="form-control"/>
</div>
</div>
<div class="form-group">
<label class="label1 col-md-4">Select the applicable user role & privileges <span class="required"> * </span> </label>
<div class="col-md-7">
<select id="Roles" style="width:100%;" data-placeholder="Select an option" multiple> </select>
</div>
</div>
<div class="form-group">
<button class="btn btn-primary" id="SubmitUserRole" type="button">submit User</button>
</div>
</form>请帮我解决这个问题。
它工作正常。所以你的问题是什么？ （悬停需要启用禁用） –
按钮启用时，我填写所有输入 –
您需要使用其他事件触发禁用/启用，而不是悬停。只有当鼠标退出表单时，才能“悬停”，然后你会看到按钮被启用。这里您希望在输入改变时启用按钮。您需要捕获更改事件。 – elpddev