Tuesday, April 30, 2019

javascript - jQuery evaluate if checkbox is checked and contains the class true





I'm creating a multiple choice assessment using jQuery. Currently the DOM structure is as follows:





  • Answer 1


  • Answer 1

  • Answer 1

  • Answer 1




I need to write a function that when the button is clicked to see if the checkbox is ticked and that the class name of the li contains 'True'.



So far this is my jQuery:




      $('.multiplechoice_answer .Paragraph').prepend('');
$('.multiplechoice_wrap').prepend('');


$('.multiplesubmit').click(function() {
multipleChoiceCheck();

});

var multipleChoiceCheck = function() {

if($('input:checkbox[name=checkme]').is(':checked') && $('.multiplechoice_answer').hasClass('True')) {
alert('correct!');
}

};

Answer



$('.multiplesubmit').click(function () {
var correctAnswers = $(this).next('ul').children('li').filter(function () {
return $(this).hasClass('True') && $(this).find('input[type="checkbox"]:checked').length>0;

});
if(correctAnswers.length>0) {
alert('found')
}
});


JSFiddle



Update




As per comments



$('.multiplesubmit').click(function () {
var correctAnswers = $(this).next('ul').children('li').filter(function () {
return $(this).hasClass('True') && $(this).find('input[type="checkbox"]:checked').length>0;
});
var wrongAnswers = $(this).next('ul').children('li').filter(function () {
return $(this).hasClass('False') && $(this).find('input[type="checkbox"]:checked').length>0;
});

if (correctAnswers.length>0 && wrongAnswers.length<1) {
alert('found')
}
});


JSFiddle


No comments:

Post a Comment

plot explanation - Why did Peaches&#39; mom hang on the tree? - Movies &amp; TV

In the middle of the movie Ice Age: Continental Drift Peaches' mom asked Peaches to go to sleep. Then, she hung on the tree. This parti...