Question

我有以下代码，当用户从下拉列表中选择时，selectedIndex用于引用存储在浏览器cookie中的表单字段变量的相应数组（var varNames0, var varNames1等）。当用户单击编辑按钮时，应显示正确的表单值以及用户设置的值。

如何根据以下代码正确提取表单值。我几乎在那里，但只看到每个数组值的第一个字母，并且数组中的位置显示在弹出的表单的底部。

<a href="#" id="btn_editvars" onclick="showEditVars();">Edit Vars</a>

<select id="product" name="product" >
        <option value="prod1" selected>Prod 1</option>
        <option value="prod2" >Prod 2</option> 
        <option value="prod3" >Prod 3</option>
        <option value="prod4" >Prod 4</option>
</select>

var varNames0 = [
        "property1", 
        "property2",
        "top",
        "property3",
        "property4",
        "closeBtn",
        "loadingText",
        "property5"];

var editableVars = function(){
        var html = "";

        var varNames = "varNames" + document.getElementById("product").selectedIndex;
        for(var i in varNames){
            html += "<p><label for="+varNames[i]+">"+varNames[i]+":</label> <input type=\"text\" id=\""+varNames[i]+"\" placeholder=\"enter "+varNames[i]+"...\" value=\""+socialVars[varNames[i]]+"\" /></p>";

        }

Answer 1

如果可能的话，如何让自己变得更容易，并构建这样的事情：

var varNames = [
    [
        "property1", 
        "property2",
        "top",
        "property3",
        "property4",
        "closeBtn",
        "loadingText",
        "property5"
    ]
];

var editableVars = function(){
        var html = "";

        var data = varNames[document.getElementById("product").selectedIndex];
        for(var i in data){
            html += "<p><label for="+data[i]+">"+data[i]+":</label> <input type=\"text\" id=\""+data[i]+"\" placeholder=\"enter "+data[i]+"...\" value=\""+socialVars[data[i]]+"\" /></p>";
        }

Answer 2

关键是使用switch语句：

var varNames;
        switch(document.getElementById("product").selectedIndex)
        {
        case 0:
            varNames = varNames0
            break;
        case 1:
            varNames = varNames1
            break;
        case 2:
            varNames = varNames2
            break;
        case 3:
            varNames = varNames3
            break;
        }

如何根据JS中的下拉选择从cookie中提取表单变量

2 个答案: