Question

使用JS（jQuery也很好）...
有没有办法使用switch语句在变量中改变变量？

相反......如何设置case语句中定义的变量覆盖使用的 ** REPLACE-THIS ** 作为脚本顶部的占位符变量。

请参阅此小提琴，了解用法：DEMO

我宁愿在代码输出中显示一个数字（由'count'定义），而不是默认 ** REPLACE-THIS ** ，因为它在此时正在进行。

例如......

HTML

<div id="phase1" class="phase1"> <h1>Foo | Bar test</h1> <form name="phase1" > <ul style="list-style:none;"> <li>Slot 1: <select name="slot1"> <option value="foo">Foo</option> <option value="bar">Bar</option> </select></li> <li>Slot 2: <select name="slot2"> <option value="foo">Foo</option> <option value="bar">Bar</option> </select></li> </ul> <br /> <input type="button" value="Build" onclick="Build();"> </form> </div> <span id="data"></span>

JS

var count= '**REPLACE-THIS**'; var uniqueID= '<div class="example" id="FooBarDiv'+count+'">'; switch (document.phase1.slot1.value){ case 'foo': slotOne = "Foo1 is:<br>"; count= '1'; slotOne += uniqueID; break; case 'bar': slotOne = "Bar1 is:<br>"; count= '1'; slotOne += uniqueID; break; } switch (document.phase1.slot2.value){ case 'foo': slotTwo = "Foo2 is:<br>"; count= '2'; slotTwo += uniqueID; break; case 'bar': slotTwo = "Bar2 is:<br>"; count= '2'; slotTwo += uniqueID; break; } output = slotOne+slotTwo; document.getElementById("data").innerHTML=output;

请注意，这是一个非常非常淡化的例子。该工作示例将根据使用下拉列表进行的选择，将大型HTML块放置到具有标记唯一ID的页面上。

稍后将使用getElementbyID脚本定位这些ID，因此，如果两次使用“FOO”，脚本仍将按预期运行并根据需要调用“FooBarDiv1”和“FooBarDiv2”。

Answer 1

为了将你的例子减少到重要的部分，让我们试试这个：

var count= '**REPLACE-THIS**'; var uniqueID = '<div class="example" id="FooBarDiv'+count+'">'; count = '1'; console.log(uniqueID); // "<div class="example" id="FooBarDiv**REPLACE-THIS**">"

那么这里发生了什么？

你不在变量中有变量。您有两个变量，第一个变量用于构造分配给另一个变量的值。构造此值后，它将不再连接到创建它的变量。它现在已经被＃34;烘焙到＆＃34;字符串设置为uniqueID。

要解决此问题，您需要在之后编写字符串，并配置所有输入。

var count= '**REPLACE-THIS**'; if (something) { count = '1'; } else { count = '2'; } var uniqueID = '<div class="example" id="FooBarDiv'+count+'">'; console.log(uniqueID); // "<div class="example" id="FooBarDiv1">" // ^ or 2

检查一下，它演示了x如何融入它生成的字符串。

var x; x = 1; var str1 = "x is "+ x; x = 2; var str2 = "x is "+ x; x = 3; var str3 = "x is "+ x; console.log(str1); // x is 1 console.log(str2); // x is 2 console.log(str3); // x is 3

您可以看到x的值发生变化，但是它帮助创建的字符串会保存创建字符串时的x值。它在创建后完全断开。

See fiddle

Answer 2

简单的替换就足够了。

slotOne = slotOne.replace('**REPLACE-THIS**',count);

重复其余的事情。虽然你应该考虑创建一个你正在使用的元素数组。

Fiddle

如你所愿：）

这使用jquery。

function Build() {
    var output = "<br>",count= '**REPLACE-THIS**';

    $("#phase1").find("select").each(function(index) {
        output += switcharoo($(this).val(), index + 1) + "<br>";
    });

    document.getElementById("data").innerHTML=output;
}

function switcharoo(value, count) {
    var uniqueID= '&lt;div class="example" id="FooBarDiv'+count+'"&gt;';
    var slot = "";

    switch (value){
        case 'foo':
            slot = "Foo";
            break;
        case 'bar':
            slot = "Bar";
            break;
    }
    slot += count + " is:<br>" + uniqueID;
    return slot.replace('**REPLACE-THIS**',count);
}

Update using jquery with each method 请注意，它可以进一步优化。但这应该让你的思想考虑它。可以重写switcharoo，只需切换到只给'foo'或'bar'，然后也可以将它放在你的return语句中。

Answer 3

如果你想重新插入一个变量，试试这个:(注意eval是邪恶的）

var a = 1;
var s = "'a = ' + a";
var r = eval(s);
console.log(r); // a = 1
a = 2;
r = eval(s);
console.log(r); // a = 2

更改案例陈述中的变量

3 个答案: