0

我有一个选择框,用户可以在其中选择他们想要选择注册的人数。例如,如果选择了 4,则 4 个人员注册区域将显示在下面的表单中:

jQuery:

var person = '<div class="reg-person"><span class="person">Person 1</span><div class="field"><label for="name">name</label><input type="text" id="name" name="name" /></div><div class="field"><label for="company">company</label><input type="text" id="company" name="company" /></div><div class="field"><label for="email">email address</label><input type="text" id="email" name="email" /></div><div class="field"><label for="contact">contact number</label><input type="text" id="contact" name="contact" /></div></div>';

            var peopleDisplayed = 0;

            $('.places-req').change(function() {
                if(peopleDisplayed == 0) {
                    peopleDisplayed = ($(this).val());
                    numberPeople = ($(this).val());
                    for(var i = 1 ; i <= numberPeople ; i++){
                        $('#register').prepend(person);
                    }
                } else {
                    var peopleDiff = ($(this).val() - peopleDisplayed);
                    if (peopleDiff > 0) {
                        for(var i = 1 ; i <= peopleDiff ; i++){
                            $('#register').prepend(person);
                        }
                    } else if (peopleDiff < 0) {
                        var diff = -peopleDiff;
                        for(var i = 1 ; i <= diff ; i++){
                            $('#register').children('div.person').last().remove();
                        }
                    }
                    peopleDisplayed = ($(this).val());
                }

            });

html是:

<form id="register" action="/event/scripts/register.html" method="post">


                        <div class="submit-field">
                            <input type="hidden" value="1" id="event" name="event" />
                            <input type="submit" value="" />
                        </div>
                        <p>* Please note that we will not pass your details to a third party.</p>
                    </form>

我的问题是如何修改代码,以便为每个人显示第 1 个人、第 2 个人等...目前他们都显示为第 1 个人。我还需要使用此数字与表单字段一起使用名称,以便它们不同,name1,name2 等。

4

2 回答 2

2

您需要使用i内部for循环来拥有 Person1 , Person2 ...

$('#register').prepend('<div class="reg-person"><span class="person">Person '+i+' </span><div class="field"><label for="name">name</label><input type="text" id="name" name="name" /></div><div class="field"><label for="company">company</label><input type="text" id="company" name="company" /></div><div class="field"><label for="email">email address</label><input type="text" id="email" name="email" /></div><div class="field"><label for="contact">contact number</label><input type="text" id="contact" name="contact" /></div></div>');
 -----------------------------------------------------------------------------^
于 2013-05-09T16:09:15.150 回答
1

我不知道如何评论,但答案就在这个小提琴上

http://jsfiddle.net/CQg8L/

parseInt(parseInt(peopleDisplayed)+i)
于 2013-05-09T16:57:29.207 回答