Question

我需要对我继承的代码块进行小的行为更改，不幸的是，这是一个非常大的函数，它构建了一个html模板并且里面有大量的for循环。

目前，模板函数中有一个部分，其中一个循环生成4个文本输入，其中包含<div>以及提交按钮。我想要做的是，如果在这个特定区域有两个以上输入的情况下，然后将两个<div>中的两个放入子状态，然后将另外两个放入另一个具有自己的div中提交，所以基本上将它们分开。这是我想要实现的快速且（非常）肮脏的视觉示例。

http://jsbin.com/izejin/5/

以下是生成单个<div>的4个输入的当前循环。我的想法是我需要设置一个计数器，当=== 2将创建新的html元素时，新的类将根据需要设置它们的样式。但我不确定如何在保持循环继续的同时实现这一目标。

if (measurementTypeGroup.MeasurementTypes.length > 1) {

    newNodeHtml += "<div id='" + measurementClass + "-3-" + measurementTypeGroup.MeasurementTypes[0].TargetConfigure[0].TargetType + "' class='target-metric input " + measurementClass + "-input'>";

    for (var k = 0; k < measurementTypeGroup.MeasurementTypes.length; k++) {
        var mType = measurementTypeGroup.MeasurementTypes[k];
        var userTarget = mType.UserTarget;
        var targetConfigure = mType.TargetConfigure[0]; 

        newNodeHtml += "<div><span>" + mType.MeasurementTypeName + " TARGET</span>" +
                    "<input type='text' id='txt-" + measurementClass + "-3-" + mType.MeasurementTypeID + "' placeholder='" + mType.UnitName + "' value='" + targetHighValue + "' " + disableAttribute + "></div>";
    }

    newNodeHtml += "<a onclick='CellClicked(" + mTypeGroupID + ", 3, 3)'><span class='check-range'></span></a>" +
            "</div>";
}

感谢您的帮助！

Answer 1

这应该是你需要的，它是一个嵌套loop，number of loops和index

if (measurementTypeGroup.MeasurementTypes.length > 1) {
    var index = 0;
    var numberOfLoops = Math.ceil(measurementTypeGroup.MeasurementTypes.length / 2);
    for (var i = 0; i < numberOfLoops; i++) {
        var newNodeHtml = '';
        newNodeHtml += "<div id='" + measurementClass + "-3-" + measurementTypeGroup.MeasurementTypes[0].TargetConfigure[0].TargetType + "' class='target-metric input " + measurementClass + "-input'>";

        for (index; index < index + 2; index++) {
            if(measurementTypeGroup.MeasurementTypes[index] === undefined)
                break;

            var mType = measurementTypeGroup.MeasurementTypes[index];
            var userTarget = mType.UserTarget;
            var targetConfigure = mType.TargetConfigure[0];

            newNodeHtml += "<div><span>" + mType.MeasurementTypeName + " TARGET</span>" +
                "<input type='text' id='txt-" + measurementClass + "-3-" + mType.MeasurementTypeID + "' placeholder='" + mType.UnitName + "' value='" + targetHighValue + "' " + disableAttribute + "></div>";
        }

        newNodeHtml += "<a onclick='CellClicked(" + mTypeGroupID + ", 3, 3)'><span class='check-range'></span></a>" +
            "</div>";
    }
}

如何在两个div之间分割4个输入？

1 个答案: