Question

我正在制作一个包含10个问题的表单，每个表单都有一个下拉选项，有五个答案选项。我的问题是，当我启动for循环时，第一个循环（外部循环）'x'由于某种原因从1而不是0开始。然后循环不断发布10个问题，直到第一个循环完成，但应该只有一组10个问题示例

Question 1
cat in train
[select drop down menu]

Question 2
the turtle
[select drop down menu]

Question 3
the slug
[select drop down menu]

Question 4
the sloth
[select drop down menu]

Question 5
where is
[select drop down menu]

Question 6
Waldo?
[select drop down menu]

Question 7
over there
[select drop down menu]

Question 8
Where?
[select drop down menu]

Question 9
hes gone
[select drop down menu]

Question 2 //then starts again at two, but it should've stopped after last set.
the turtle

Question 3
the slug

Question 4
the sloth

Question 5
where is

Question 6
Waldo?

Question 7
over there

Question 8
Where?

Question 9
hes gone

Question 3
the slug

Question 4
the sloth

Question 5
where is

Question 6
Waldo?

Question 7
over there

Question 8
Where?

Question 9
hes gone

Question 4
the sloth

Question 5
where is

Question 6
Waldo?

Question 7
over there

Question 8
Where?

Question 9
hes gone

Question 5
where is

Question 6
Waldo?

Question 7
over there

Question 8
Where?

Question 9
hes gone

Question 6
Waldo?

Question 7
over there

Question 8
Where?

Question 9
hes gone

Question 7
over there

Question 8
Where?

Question 9
hes gone

Question 8
Where?

Question 9
hes gone

Question 9
hes gone

代码

        var questions = ['Dog on plane', 'cat in train', 'the turtle', 'the slug', 'the sloth', 'where is', 'Waldo?', 'over there', 'Where?', 'hes gone'];
        var options = [ 
            'Select an Option',
            {
                val: 1,
                text: "1 (strongly agree)"
            },
            {
                val: 2,
                text: "2"
            },
            {
                val: 3,
                text: "3"
            },
            {
                val: 4,
                text: "4"
            },
            {
                val: 5,
                text: "5 (dont agree at all)"
            }
        ];

        var nameLabel = $('<label for="name">' + "Your Name" + '</label>' + '<br>');
        $('.rForm').append(nameLabel);
        var namePut = $('<input type="text" id="name" placeholder="Name">' + '<br>' + '<br>');
        $('.rForm').append(namePut);
        var photo = $('<label for="link">' + "Your Photo Link" + '</label>' + '<br>');
        $('.rForm').append(photo);
        var photoPut = $('<input type="text" id="link" placeholder="Your Photo Link">' + '<br>' + '<br>');
        $('.rForm').append(photoPut);

        for(var x = 0; x < questions.length; x++)
        {
            //x starts at 1 for some reason. First question should be dog one but it starts at cat question
            var div = $('<div class="containter">');
            var h3 = $('<h3 style="margin-bottom: 5px;">' + "Question" + " " + x + '</h3>');
            $('.containter').append(h3);
            var label = $('<label>').attr('id', 'q'+ x).text(questions[x]);
            var br = $('<br>');
            $('.containter').append(label);
            $('.containter').append(br);
            var select = $('<select>').attr('id', 'q'+ x);

            for(var i = 0; i < options.length; i++)
            {
                if(i === 0){
                    select.append($('<option>').text(options[i]));
                }
                else{
                    select.append($('<option>').attr('value', options[i].val).text(options[i].text));
                }

                console.log('hi')
            }
            $('.containter').append(select);

            $('.rForm').append(div);
        }

Answer 1

您的问题是您正在按类访问<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="image-box my4"> <div class="images"> <div class="slide slide-2"> <div> <img src="http://test.storeapps.org/wp-content/uploads/2016/11/Putler-Web-customers-sample.png" alt="" /> </div> <div> <div class="text"> <h2>This is the text for slide 1</h2> </div> </div> </div> <div class="slide slide-2"> <div> <img src="http://test.storeapps.org/wp-content/uploads/2016/11/Putler-Web-customers-sample.png" alt="" /> </div> <div> <div class="text"> <h2>This is the text for slide 2</h2> </div> </div> </div> <div class="slide slide-2"> <div> <img src="http://test.storeapps.org/wp-content/uploads/2016/11/Putler-Web-customers-sample.png" alt="" /> </div> <div> <div class="text"> <h2>This is the text for slide 3</h2> </div> </div> </div> </div> <div class="buttons"><span class="slide-button">button-1</span><span class="slide-button">button-2</span><span class="slide-button">button-3</span> </div> </div> div，因此每次添加问题时，都会将其添加到新div以及之前的所有div中。

循环行为的示例。

container

解决方案：

After 1st loop
div.container
   Q1

After 2nd loop
div.container
   Q1
   Q2
div.container
   Q2
and keep going

For循环变量从1开始而不是0和jquery问题

1 个答案: