jQuery似乎无法检测附加输入的值。
$(document).ready(function() {
var i = 1;
// This is where I append the additional inputs.
$('.wiz-btn-add').click(function() {
i = i + 1;
$('.educ-cont-add').append(
'<div class="educ-title">Attainment ' + i + '</div>' +
'<div class="req2 educ-wiz-col-1">' +
'<div><label>Name of School*</label></div>' +
'<div><label>Degree Course</label></div>' +
'<div><label>Inclusive Date From</label></div>' +
'</div>' +
'<div class="educ-wiz-col-2">' +
'<div>' +
'<input name="school[]" type="text" class="req2 wizard-input-school">' +
'<label>Year Graduated*</label>' +
'<input name="grad[]" type="text" class="req2 wizard-input-grad">' +
'</div>' +
'<div>' +
'<input name="degree[]" type="text" class="req2 wizard-input-degree">' +
'<label>Level*</label>' +
'<select name="level[]" class="req2 wizard-input-level" name="level">' +
'<option>Select Level</option>' +
'<option>College</option>' +
'<option>Post Graduate</option>' +
'<option>Vocational</option>' +
'</select>' +
'</div>' +
'<div>' +
'<input name="astart[]" type="text" class="req2 wizard-input-start">' +
'<label>Inclusive Date From</label>' +
'<input name="afinish[]" type="text" class="req2 wizard-input-afinish">' +
'</div>' +
'</div>' +
'<div class="content-line"></div>' );
} );
// This where I check the values of each if its empty.
$('.req2').keyup(function(){
if (
$(".wizard-input-school").val() != "" &&
$(".wizard-input-degree").val() != "" &&
$(".wizard-input-afinish").val() != "" &&
$(".wizard-input-astart").val() != "" &&
$(".wizard-input-level").val() != "none" &&
$(".wizard-input-grad").val() != ""
) {
$(".wiz-next2").removeAttr('disabled');
$(".wiz-next2").css("opacity","1")
} else if (
$(".wizard-input-school").val() === "" ||
$(".wizard-input-degree").val() === "" ||
$(".wizard-input-afinish").val() === "" ||
$(".wizard-input-astart").val() === "" ||
$(".wizard-input-level").val() === "none" ||
$(".wizard-input-grad").val() === ""
) {
$('.wiz-next2').attr('disabled','disabled');
$(".wiz-next2").css("opacity",".5")
}
});
} );
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wizard-content2">
<div class="educ-title">Attainment 1</div>
<div class="educ-wiz-col-1">
<div>
<label>Name of School*</label>
</div>
<div>
<label>Degree Course</label>
</div>
<div>
<label>Inclusive Date From</label>
</div>
</div>
<div class="educ-wiz-col-2">
<div>
<input name="school[]" type="text" class="req2 wizard-input-school">
<label>Year Graduated*</label>
<input name="grad[]" type="text" class="req2 wizard-input-grad">
</div>
<div>
<input name="degree[]" type="text" class="req2 wizard-input-degree">
<label>Level*</label>
<select name="level[]" class="req2 wizard-input-level" name="level">
<option value="none">Select Level</option>
<option value="College">College</option>
<option value="Post Graduate">Post Graduate</option>
<option value="Vocational">Vocational</option>
</select>
</div>
<div>
<input name="astart[]" type="text" class="req2 wizard-input-astart">
<label>Inclusive Date From</label>
<input name="afinish[]" type="text" class="req2 wizard-input-afinish">
</div>
</div>
<div class="content-line"></div>
<div class="educ-cont-add"></div>
谢谢!