Question

我添加了用户将自己的值输入到6个输入字段的功能，其中部分或全部可以留空。我已经有一个填充了默认值的数组。如何将用户的值输入该数组，以便对其执行计算？

用户可以使用提供的值或输入自己的值。提供的值部分工作正常。我现在正在添加用户添加自己的值的能力（HTML的下半部分）。

        <table border="0" cellpadding="5" cellspacing="0" width="100%">
            <tr>
                <td class="alignright">
                    <form id="form2">
                        <select class="displayLength" name="ratio" size="6">
                            <option value=''>Choose:</option>
                            <option value='sc10_4x4'>SC10 4x4: 58, 60, 62, 93</option> 
                            <option value='sc10'>SC10: 75, 78, 81, 84, 87</option> 
                            <option value='sc8'>SC8: 50, 52, 54</option> 
                            <option value='b44'>B44: 72, 75, 78, 81, 84</option> 
                            <option value='b4t4'>B4, T4: 72, 75, 78, 81, 84, 87</option> 
                            <option value='gt2'>GT2: 54, 55, 56</option> 
                        </select>
                </td></tr>

//这部分是新的：

                <tr><td>
                Alternate spur values:<br><br>
                <input class="display" type="number" size="14" value="" name="spur1">&nbsp;
                <input class="display" type="number" size="14" value="" name="spur2">&nbsp;
                <input class="display" type="number" size="14" value="" name="spur3"><br><br>
                <input class="display" type="number" size="14" value="" name="spur4">&nbsp;
                <input class="display" type="number" size="14" value="" name="spur5">&nbsp;
                <input class="display" type="number" size="14" value="" name="spur6">
                </td></tr>
            <tr>
                <td class="alignright">
                    <input id="buttonNewRatios" class="buttPress2" type="button" value="Alternates"><br><br>
                        <textarea name="moreRatios" cols="42" rows="8"></textarea> 
                </td></tr></form></table>

这是我遇到问题的Javascript部分。我不知道如何将用户值合并到交换机中，因此其余代码可以运行这些值。我通过JSHint.com运行代码并通过了。但是，没有显示任何结果。

    function gearSpurs(ratio) {
    var form = document.getElementById('formGearRatio');
    var spur1 = form.elements.spur1.value,
        spur2 = form.elements.spur2.value,
        spur3 = form.elements.spur3.value,
        spur4 = form.elements.spur4.value,
        spur5 = form.elements.spur5.value,
        spur6 = form.elements.spur6.value;

        var spurs = [];

        switch (ratio) {
            case 'sc10_4x4':
            spurs = ['58', '60', '62', '93'];
            break;
            case 'sc10':
            spurs = ['75', '78', '81', '84', '87'];
            break;
            case 'sc8':
            spurs = ['50', '52', '54'];
            break;
            case 'b44':
            spurs = ['72', '75', '78', '81', '84'];
            break;
            case 'b4t4':
            spurs = ['72', '75', '78', '81', '84', '87'];
            break;
            case 'gt2':
            spurs = ['54', '55', '56'];
            break;
            default:
            spurs = [spur1, spur2, spur3, spur4, spur5, spur6];
            break;
        }
        return spurs;
    }

如何让spur1 ... 6正确合并到switch语句中？（此代码在iPhone和Android环境中使用。）除了添加之外，效果很好。）

Answer 1

您可以在switch语句之前添加它们，如下所示：

spurs = [spur1, spur2, spur3, spur4, spur5, spur6];

然后更改开关案例中的语句以使用将添加到数组末尾的push函数：

spurs.push(['58', '60', '62', '93']);

或者，您可以单独保留开关，并在switch语句后使用push添加6个值，如下所示：

spurs.push([spur1, spur2, spur3, spur4, spur5, spur6]);

Answer 2

编辑：根据您接受的答案，您现在似乎想要返回包含2个阵列的数组。一个具有预定义的比率，一个具有用户定义的分支。

如果这是正确的，该功能变得更加简单：

var ratios = {
    sc10_4x4: ['58', '60', '62', '93'],
    sc10:     ['75', '78', '81', '84', '87'],
    sc8:      ['50', '52', '54'],
    b44:      ['72', '75', '78', '81', '84'],
    b4t4:     ['72', '75', '78', '81', '84', '87'],
    gt2:      ['54', '55', '56']
};

function gearSpurs(ratio) {

    var form = document.getElementById('formGearRatio'),
        spur1 = form.elements.spur1.value,
        spur2 = form.elements.spur2.value,
        spur3 = form.elements.spur3.value,
        spur4 = form.elements.spur4.value,
        spur5 = form.elements.spur5.value,
        spur6 = form.elements.spur6.value;

    return [ [spur1, spur2, spur3, spur4, spur5, spur6], ratios[ratio] ];

}

您的表单标签不平衡。只需将整个<table>与<form>一起打包即可。 （您不能在一个<td>中开始表单，而是在另一个表单中结束。）

<form id="form2">
    <table border="0" cellpadding="5" cellspacing="0" width="100%">
        <tr>...</tr>

        <tr>...</tr>
        <tr>...</tr>
    </table>
</form>

我没有看到任何ID为formGearRatio的元素。

你可以像这样重做代码来简化一下：

var ratios = {
    sc10_4x4: ['58', '60', '62', '93'],
    sc10: ['75', '78', '81', '84', '87'],
    sc8: ['50', '52', '54'],
    b44: ['72', '75', '78', '81', '84'],
    b4t4: ['72', '75', '78', '81', '84', '87'],
    gt2: ['54', '55', '56']
};

function gearSpurs(ratio) {

    if (ratios[ratio]) {
        return ratios[ratio];
    } else {
        var form = document.getElementById('formGearRatio'),
            spur1 = form.elements.spur1.value,
            spur2 = form.elements.spur2.value,
            spur3 = form.elements.spur3.value,
            spur4 = form.elements.spur4.value,
            spur5 = form.elements.spur5.value,
            spur6 = form.elements.spur6.value;
        return [spur1, spur2, spur3, spur4, spur5, spur6];
    }
}

Answer 3

我唯一看错的代码就是你试图找到一个名为formGearRatios的表单，但表单实际上称为form2。如果你改变那一行，其余的就在我的测试中工作（如果用户没有选择任何东西，它将使用备用输入中的值）。

编辑作为一个注释，我还必须编辑一个方法来调用你的函数并检索比率的值，所以假设你的完整代码已经正确地执行了，唯一的问题是表单标识。

如何将用户的输入值输入JS数组？

3 个答案: