这里我每个li都有3个单选按钮,其中一个有选择下拉列表。如果用户选择了学校单选按钮,我需要在按钮提交时验证此下拉列表。但是这些类没有应用于选择下拉列表。
$(".retail-proceed-purchase").click(function() {
var checkout_delivery_option = $(".cartcontinue .delivery_option").val();
if (checkout_delivery_option == 'your_school') {
var school = $('#school_list :selected').val();
if (school == 'your_school') {
$('.school_name').addClass("needsfilled");
$('.school_name').attr("placeholder", emptyerror);
return false;
}
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li>
<input type="radio" id="school" name="delivery" value="your_school">
<label for="school">
<select class="school_name" id="school_list">
<option label="Send to school" value="your_school">Send to school</option>
<option value="your_school a">Send to school A</option>
<option value="your_school b">Send to school B</option>
</select>
</label>
<div class="check"></div>
</li>
答案 0 :(得分:0)
试试这个
$(".retail-proceed-purchase").click(function() {
school_element = $("[type='radio'][value='your_school']")
if(school_element.is(':checked')){
school_list_element = school_element.parents("li").find("select.school_name")
if(school_list_element.val() == "your_school"){
alert('Please choose school name from list')
school_list_element.addClass("needsfilled");
school_list_element.attr("placeholder", "error occured");
} else {
alert('form submitted')
}
}else{
alert('form submitted')
}
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="cartcontinue">
<li>
<input type="radio" id="school" name="delivery" value="your_school">
<label for="school">
<select class="school_name" id="school_list">
<option label="Send to school" value="your_school">Send to school</option>
<option value="your_school a">Send to school A</option>
<option value="your_school b">Send to school B</option>
</select>
</label>
<div class="check"></div>
</li>
<li>
<input type="radio" id="school" name="delivery" value="your_college">
Second radio button
<div class="check"></div>
</li>
</div>
<br><br>
<button class="retail-proceed-purchase">proceed</button>
&#13;