Magento中的链式下拉菜单无法正常工作

时间：2015-06-02 08:46:33

标签： javascript jquery drop-down-menu chained chained-select

我正在寻找3天的分辨率，但我无法获得最后的部分以使其成为可能。

我的问题是我无法确定我的3个菜单之间的依赖关系。

这意味着C的选项应取决于B中选择的值，B的选项必须取决于A中选择的值，即a-> b-> c

我只获得菜单a - ＆gt; b，但不是b - ＆gt; C。

如果有人可以给我一个新的代码，我只需要选择。

这是我的代码：

<html>

<head>
  <style type="text/css">
  </style>

  <script language="Javascript">
    <!-- Start 
    function update_auswahl1() {
        var speicher;
        var auswahl1 = document.forms.verzeichnis.auswahl1;
        var auswahl2 = document.forms.verzeichnis.auswahl2;
        var auswahl3 = document.forms.verzeichnis.auswahl3;
        auswahl2.options.length = 0; // DropDown Menü entleeren 
        auswahl3.options.length = 0; // DropDown Menü entleeren 

        //********************** AUSWAHL 1 ****************************************************************

        if (auswahl1.options[auswahl1.selectedIndex].value == "a") {
          auswahl2.options[0] = new Option("d");
          auswahl2.options[1] = new Option("e");
        } else if (auswahl1.options[auswahl1.selectedIndex].value == "b") {
          auswahl2.options[0] = new Option("e");
          auswahl2.options[1] = new Option("f");
        } else if (auswahl1.options[auswahl1.selectedIndex].value == "c") {
          auswahl2.options[0] = new Option("f");
          auswahl2.options[1] = new Option("g");
        } else if (auswahl1.options[auswahl1.selectedIndex].value == "") {
          auswahl2.options[0] = new Option("---- Bitte waehlen ----");
        }


        //*************************************************************************************************

        //********************* AUSWAHL 2 *****************************************************************   

        if (auswahl2.options[auswahl2.selectedIndex].values == "d") {
          auswahl3.options[0] = new Option("h");
          auswahl3.options[1] = new Option("i");
          auswahl3.options[2] = new Option("j");
        } else if (auswahl2.options[auswahl2.selectedIndex].values == "e") {
          auswahl3.options[0] = new Option("i");
          auswahl3.options[1] = new Option("j");
          auswahl3.options[2] = new Option("k");
        } else if (auswahl2.options[auswahl2.selectedIndex].values == "f") {
          auswahl3.options[0] = new Option("k");
          auswahl3.options[1] = new Option("l");
          auswahl3.options[2] = new Option("m");
        }
      }
      //*************************************************************************************************
      // Ende -->
  </script>
  <title>Unbenanntes Dokument</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
  <form name="verzeichnis">
    <select size="1" name="auswahl1" onChange="update_auswahl1()">
      <option value="" selected>---- Bitte w&auml;hlen ----</option>
      <option value="a">a</option>
      <option value="b">b</option>
      <option value="c">c</option>
    </select>
    <br>
    <br>
    <select size="1" name="auswahl2">
      <option selected>---- Bitte w&auml;hlen ----</option>
    </select>
    <br>
    <br>
    <select name="auswahl3" size="1">
      <option selected>---- Bitte w&auml;hlen ----</option>
    </select>
  </form>

</body>

</html>

我感谢4每一次帮助

1 个答案:

答案 0 :(得分：0)

你犯了3个错误：

  1. 在if-else阻止“AUSWAHL 2”中输入“.values”而不是“.value”

      

    （auswahl2.options [auswahl2.selectedIndex] .values ==“d”）

    2.   
  2. 您尚未在select auswahl2上添加处理程序。
    3.   
  3. 需要编写2个函数而不是1，否则当您更改auswahl2时，他将被覆盖而不存储所选值。
    4.      
    <html>

<head>
  <style type="text/css">
  </style>

  <script language="Javascript">
    <!-- Start 
    function update_auswahl1() {
        var speicher;
        var auswahl1 = document.forms.verzeichnis.auswahl1;
        var auswahl2 = document.forms.verzeichnis.auswahl2;
        var auswahl3 = document.forms.verzeichnis.auswahl3;
        auswahl2.options.length = 0; // DropDown Menü entleeren 
        auswahl3.options.length = 0; // DropDown Menü entleeren 

        //********************** AUSWAHL 1 ****************************************************************

        if (auswahl1.options[auswahl1.selectedIndex].value == "a") {
          auswahl2.options[0] = new Option("d");
          auswahl2.options[1] = new Option("e");
        } else if (auswahl1.options[auswahl1.selectedIndex].value == "b") {
          auswahl2.options[0] = new Option("e");
          auswahl2.options[1] = new Option("f");
        } else if (auswahl1.options[auswahl1.selectedIndex].value == "c") {
          auswahl2.options[0] = new Option("f");
          auswahl2.options[1] = new Option("g");
        } else if (auswahl1.options[auswahl1.selectedIndex].value == "") {
          auswahl2.options[0] = new Option("---- Bitte waehlen ----");
        }

        update_auswahl2();
        //*************************************************************************************************
    }

      function update_auswahl2() {
        var speicher;
        var auswahl2 = document.forms.verzeichnis.auswahl2;
        var auswahl3 = document.forms.verzeichnis.auswahl3;
        auswahl3.options.length = 0; // DropDown Menü entleeren 

        //********************* AUSWAHL 2 *****************************************************************   
        if (auswahl2.options[auswahl2.selectedIndex].value == "d") {
          auswahl3.options[0] = new Option("h");
          auswahl3.options[1] = new Option("i");
          auswahl3.options[2] = new Option("j");
        } else if (auswahl2.options[auswahl2.selectedIndex].value == "e") {
          auswahl3.options[0] = new Option("i");
          auswahl3.options[1] = new Option("j");
          auswahl3.options[2] = new Option("k");
        } else if (auswahl2.options[auswahl2.selectedIndex].value == "f") {
          auswahl3.options[0] = new Option("k");
          auswahl3.options[1] = new Option("l");
          auswahl3.options[2] = new Option("m");
        }
      }
      //*************************************************************************************************
      // Ende -->
  </script>
  <title>Unbenanntes Dokument</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
  <form name="verzeichnis">
    <select size="1" name="auswahl1" onChange="update_auswahl1()">
      <option value="" selected>---- Bitte w&auml;hlen ----</option>
      <option value="a">a</option>
      <option value="b">b</option>
      <option value="c">c</option>
    </select>
    <br>
    <br>
    <select size="1" name="auswahl2" onChange="update_auswahl2()">
      <option selected>---- Bitte w&auml;hlen ----</option>
    </select>
    <br>
    <br>
    <select name="auswahl3" size="1">
      <option selected>---- Bitte w&auml;hlen ----</option>
    </select>
  </form>

</body>

</html>

相关问题
最新问题