查询多个语句,将变量保持在一个级别

时间:2013-04-23 03:16:47

标签: jquery push each

我试图深入了解在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,以便我可以在一个级别验证所有这些。

http://jsfiddle.net/VEtx8/

由于

理查德

1 个答案:

答案 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);
         });