我试图深入了解在Jquery中做某事的最佳方式。
HTML
<div class="questionblock" id="questionblock1" data-load="questionblock2">
<div class="row inline">
<div class="labelholder">
<strong>Q:</strong>
<label>Question 1</label>
</div>
<div class="inputholder">
<strong>A:</strong>
<select data-val="question1">
<option data-value="default">Please select</option>
<option>Answer 1</option>
<option>Answer 2</option>
</select>
</div>
</div>
</div>
<div class="questionblock" id="questionblock2" data-load="questionblock3">
<div class="row inline">
<div class="labelholder">
<strong>Q:</strong>
<label>Question 2</label>
</div>
<div class="inputholder">
<strong>A:</strong>
<select data-val="question1">
<option data-value="default">Please select</option>
<option>Answer 1</option>
<option>Answer 2</option>
</select>
</div>
</div>
<div class="row inline">
<div class="labelholder">
<strong>Q:</strong>
<label>Question 3</label>
</div>
<div class="inputholder">
<strong>A:</strong>
<select data-val="question2">
<option data-value="default">Please select</option>
<option>Answer 1</option>
<option>Answer 2</option>
</select>
</div>
</div>
</div>
JS
<script type="text/javascript">
$(function () {
$('#content').removeClass('nojs');
$('.questionblock').not('#questionblock1').hide();
$('.questionblock').each(function () {
var myQuestions = [];
var block = $(this).attr('id');
var load = $(this).data('load');
$(this).children().children().children('select').each(function () {
var questions = $(this).data('val');
});
console.log(block, questions);
});
});
</script>
我希望能够使用一类questionblock获取每个div,读取id,然后获取此div中的所有选择框,并输出它们的data-val,以便我可以在一个级别验证所有这些。
由于
理查德
答案 0 :(得分:0)
var questions;
function getQuestions() {
questions = [];
$('.questionblock').each(function () {
var block = $(this).attr('id');
var load = $(this).data('load'); // Not used?
$(this).find('select').each(function () {
questions.push($(this).data('val'));
});
console.log(block, questions);
});
}
$(function() {
getQuestions();
$(".questionblock select").change(getQuestions);
});