Javascript，If-Else语句，使用按钮和列表

我想在这个项目结束时创建图表，并有一些选项，你可以为你想要创建的图表选择。这里有一个下拉列表，其中有几个选项：您想要什么类型的图表，以及其中数据的复选框。对于我的问题，我想编写一个if-else语句，当该语句为true时，它会向我显示一个带有“true”的警报

我已经有了一个函数，它可以获取列表的选定值，但是如果我构建if-else语句，就不会得到预期的结果。因此，我将向您展示代码：

<button id="button" onclick="function2()"><strong>create Chart</strong> </button>

<script>

      function getSelectValue()
      {
          var selectedValue=document.getElementById("Grafikliste").value;
          console.log(selectedValue)
      }
      getSelectValue();


      if (selectedValue=="balkendiag")
      {
         button.onclick(alert("True"))
      }
      else {
          alert("Error!!!")
      }
  }

创建图表
函数getSelectValue（）
{
var selectedValue=document.getElementById（“Grafikliste”）.value；
console.log（selectedValue）
}
getSelectValue（）；
如果（selectedValue==“balkendiag”）
{
按钮。onclick（警报（“True”））
}
否则{
警报（“错误！！！”）
}
}

在这里您可以看到列表的代码

<select id ="Grafikliste" onchange="getSelectValue()">
        <option value="balkendiag">Balkendiagramm</option>

巴尔肯图解

您的代码中存在一些问题

如果/否则未按预期工作：

这是一个范围问题

selectedValue变量是getSelectedValue函数的本地变量。从你的功能之外看不到它

您可以通过将其声明为全局变量来修复它，例如：

var selectedValue; 
function getSelectValue() {
  selectedValue=document.getElementById("Grafikliste").value;
  console.log(selectedValue)
}
getSelectValue();

if (selectedValue=="balkendiag") {
  button.onclick(alert("True"))
} else {
  alert("Error!!!")
}

或使函数返回值：

function getSelectValue() {
  var selectedValue=document.getElementById("Grafikliste").value;
  console.log(selectedValue);
  return selectedValue;
}


if (getSelectValue() =="balkendiag") {
  button.onclick(alert("True"))
} else {
  alert("Error!!!")
}

2。事件处理

要对用户事件（如单击按钮）做出反应，您不应该在HTML按钮中使用

onclick

，而应该使用

addEventListener

函数

修复了所有问题的代码段：

函数getSelectValue（） { var selectedValue=document.getElementById（“Grafikliste”）.value； console.log（selectedValue）； 返回selectedValue； } 函数function2（）{ 如果（getSelectValue（）=“balkendiag”） { 警惕（“真实”）； }否则{ 警告（“错误！！！”； } } document.getElementById（“按钮”）.addEventListener（“单击”，函数2）； document.getElementById（“Grafikliste”）.addEventListener（“更改”，函数2）

创建图表
巴尔肯图解

您在getSelectValue函数中使用了带有关键字var的selectedValue，将该关键字限制为该函数的本地关键字。考虑删除VAR来修复你的问题

，首先，内联侦听器（<代码> OnCase=）“”被蔑视

<button id="create"><strong>create Chart</strong> </button>
<select id ="diagramType">
    <option value="balkendiag">Balkendiagramm</option>
    <option value="baumdiag">Baumdiagramm</option>
</select>

---

PS：您不能访问变量通常意味着您应该重新构造代码…

将selectedValue用作全局变量您正在函数内部声明

selectedValue

，这意味着它在函数外部不存在。然后，如果您尝试在外部访问它，则该值将是

未定义的

。其中是

函数2

？而不是设置和记录，返回该值并在以后编写问题时在

if

条件中使用，请注意，如果你确定问题的描述是正确的（好的语法，适当的时候有更多的新词），对我们会很有帮助。另外，如果您提供尽可能多的代码以避免混淆，这也会很有帮助。它需要更多的时间来准备，但它是值得的。

 window.onload = function(){
   //get the elements
   const diagramType = document.getElementById("diagramType"),
         create = document.getElementById("create");
   //if create was clicked
   create.onclick = function(){
     //switch based on fhe diagramTypes value
     switch(diagramType.value){
       case "balkendiag" :
          alert("Balkendigramm!");
       break;
       //...
     }
  };
 };