首页 > 解决方案 > 嵌套 for 循环中断父循环

问题描述

function next() {
        document.getElementById('config').setAttribute("hidden","true");
        document.getElementById('formdiv').removeAttribute("hidden");
        mixer();
}
function mixer() {
    var x = 0;
    for (var i = 0; i < parseInt(document.getElementById('nm').value); i++) {
        var title = document.createElement("P");
        title.style = "font-family:verdana;font-size:18px;";
        title.id = "p"+String(i);
        document.getElementById("myForm").appendChild(title);
        document.getElementById("p"+String(i)).innerText = "Enter the amount of mixer number "+String(i+1);

        var mixers = document.createElement("INPUT");
        mixers.type = "text";
        mixers.id = "m"+String(i);
        mixers.size = '1';
        document.getElementById("myForm").appendChild(mixers);

        var options = ['Select a unit','ml','L','UK Pints','US Pints'];

        var dropdown = document.createElement("SELECT");
        dropdown.id = "s"+String(x);
        document.getElementById("myForm").appendChild(dropdown);

        /*for (j = 0; i < options.length; j++) {
            var optiontag = document.createElement("OPTION");
            optiontag.value = options[j];
            optiontag.innerText = options[j];
            document.getElementById("s"+String(x)).appendChild(optiontag);
        }*/
        x += 1;
    }
}

此函数在传递 mn = 3 时创建输出

https://imgur.com/Hhv6fVE

当我取消注释底部的嵌套循环时,它会输出这个

https://imgur.com/80juxgX

它应该输出与第一张图像相同的输出,但带有下拉菜单的选项

标签: javascriptfor-loop

解决方案


推荐阅读