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



我有以下代码,当用户从下拉列表中选择时,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>";
        }
如果

可能的话,让自己更容易一点,并像这样构建一些东西:

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>";
        }

关键是使用 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;
        }

最新更新