嵌套for循环在jQuery中的问题

时间:2009-11-17 10:49:29

标签: jquery forms append

我是一个jQuery新手,所以要温柔!我有一个循环,在表单中输出额外的字段(基于值)。到目前为止都很好。但是,在我的额外字段中是出生日期,我通常使用循环创建日/年选项。我的问题是,如何在外部循环中创建这个内部循环?这是迄今为止的基本大纲:

    function addRow() {
    for(var i=1;i<numPax;i++)
    {
        $('#additionalPax').append("My additional fields HTML in here.");
    }
}

现在我要做的是在我的追加字符串中添加一个循环来创建我的日期选择。这是不对的,但是这样的事情:

    function addRow() {
        for(var i=1;i<numPax;i++)
        {
            $('#additionalPax').append("<select name='dobDay'><option selected='selected' value='1'>1</option>"+for(var d=2;d<32;d++){+"<option value="+(d)+">"+(d)+"</option>"+}+"</select>");
        }
}

非常感谢任何帮助。

5 个答案:

答案 0 :(得分:1)

可能与您正在寻找的东西相似

function addRow() {
 for(var i=1;i<numPax;i++)
 {
   var data = "";
   for(var d=2;d<32;d++)
   {
     data += "<option value="+d+">"+d+"</option>";
   }

   $('#additionalPax').append("<select name='dobDay'><option selected='selected' value='1'>1</option>"+data+"</select>");
 }
}

答案 1 :(得分:0)

你不能这样做。在select循环之外构建for并将其放在一个变量中,然后您可以在for循环中使用该变量:

function addRow() {
    var $elem = $('#additionalPax'),
        buffer;
    buffer = "<select name='dobDay'><option selected='selected' value='1'>1</option>";
    for (var d=2; d<32; d++) {
        buffer += "<option value="+(d)+">"+(d)+"</option>";
    }
    buffer += "</select>";
    for (var i=1; i<numPax; i++) {
        $elem.append(buffer);
    }
}

答案 2 :(得分:0)

您必须先将整个字符串复制到临时变量中,然后将其发送到追加函数。

var strOption = "";

for(var d = 2; d < 32; d++) {
    strOption += "<option value=" +  d + ">" +  d  + "</option>";
}

编辑:为了创建动态元素,请使用document.createElement,因为它比jQuery替代方案更快,尽管jQuery v1.3对此进行了优化,但document.createElement仍然更快。

答案 3 :(得分:0)

只需构建一个这样的字符串:

function addRow()
{
    for(var i=1;i<numPax;i++)
    {
        var str = "<select name='dobDay'><option selected='selected' value='1'>1</option>";

        for(var d = 2; d < 32; d++)
        {
            str += '<option value="' + d + '">' + d + '</option>';
        }

        str += '</select>';

        $('#additionalPax').append(str);
    }
}

答案 4 :(得分:0)

您可以使用此代码:

<select id="additionalPax"></select>
<script type="text/javascript">
    function CreateDays()
    {
        var options = '';
        for (var i = 1; i <= 31; i++)
        {
                 options += (i == 1) ? 
                 "<option selected='selected' value='" + i + "'>" + i + "</option>" : 
                 "<option value='" + i + "'>" + i + "</option>";
        }

        $('#additionalPax').html(options);
    }
    CreateDays();
</script>