Question

我正在通过具有类别的菜单下拉列表来创建主题Randomizer。每个类别都有一个相关的项目数组。例如，我有一个充满哺乳动物的阵列，如果用户从下拉列表中选择“哺乳动物”，他们就会从哺乳动物阵列中获得随机的哺乳动物。

我可以用一堆if语句来做，检查一个值是否是哺乳动物，使用哺乳动物数组。问题在于会有很多类别/数组。因此，我试图找到一种获取值的方法，然后使用相同的名称获取数组。

这里是仅使用if语句的工作代码：

<form class="firstItem">
        <select name="firstName" id="firstName">
            <option value="animals">---Animals---</option>
            <option value="mammals">Mammals</option>
            <option value="insects">Insects</option>
            <option value="birds">Birds</option>
            <option value="reptiles">Reptiles</option>
            <option value="fish">Fish/Aquatic</option>
            <option value="prehistoric">Prehistoric</option>
        </select>
    </form>
    <button class="button" id="submitBtn" onclick="submit()">Submit</button>

    <div class="results">
        <p id="resultsp"></p>
    </div>

<script>
    var mammals = ["Cow", "Horse", "Pig", "Donkey", "Elephant"];

    var insects = ["Weevil", "Hercules Beetle", "Ladybug", "Tarantula", "Moth"];

    function submit() {
        var firstName = document.getElementById("firstName");
        var firstTemp = firstName.value;
        var whatVar;

        if (firstTemp == "mammals") {
            whatVar = mammals.slice(0);
        } else if (firstTemp == "insects") {
            whatVar = insects.slice(0);
        } 
        random_items(whatVar);

        var resultsp = document.getElementById("resultsp");
        resultsp.innerText = random_items(whatVar);

        function random_items(firstName)
        {
            return whatVar[Math.floor(Math.random()*whatVar.length)];
        }
    }
</script>

我想用表示firstName值的东西替换所有if语句，抓住那个变量。

我尝试将所有if语句替换为：

var whatVar = firstTemp;

但是由于firstTemp是一个值，它将像字符串一样对待它，因此，如果选择了哺乳动物，它会吐出哺乳动物一词的一个字母，而不是哺乳动物数组中的一个字母。

我会以完全错误的方式进行此操作吗？

Answer 1

尝试此操作。通过eval（）函数很容易。我认为它对您有用！

<form class="firstItem">
      <select name="firstName" id="firstName">
        <option value="animals">---Animals---</option>
        <option value="mammals">Mammals</option>
        <option value="insects">Insects</option>
        <option value="birds">Birds</option>
        <option value="reptiles">Reptiles</option>
        <option value="fish">Fish/Aquatic</option>
        <option value="prehistoric">Prehistoric</option>
      </select>
    </form>
    <button class="button" id="submitBtn" onclick="submit()">Submit</button>

    <div class="results">
      <p id="resultsp"></p>
    </div>

    <script>
      var mammals = ["Cow", "Horse", "Pig", "Donkey", "Elephant"];

      var insects = ["Weevil", "Hercules Beetle", "Ladybug", "Tarantula", "Moth"];

      function submit() {
        var firstName = document.getElementById("firstName");
        var firstTemp = firstName.value;
        var whatVar = eval(firstTemp).slice(0);

        random_items(whatVar);

        var resultsp = document.getElementById("resultsp");
        resultsp.innerText = random_items(whatVar);

        function random_items(firstName) {
          return firstName[Math.floor(Math.random() * whatVar.length)];
        }
      }
</script>

仅需在要将字符串转换为变量的任何地方添加此行

eval(firstTemp).slice(0);

如何在Javascript中比较输入值和数组名称

1 个答案: