【问题标题】:Chained Dropdown Menu in Magento not workingMagento中的链式下拉菜单不起作用
【发布时间】:2015-08-15 23:11:23
【问题描述】:

我正在寻找大约 3 天的解决方案,但我无法获得最终部分以使其成为可能。

我的问题是我无法在 3 个菜单之间建立依赖关系。

这意味着 C 的选项应该依赖于在 B 中选择的值,而 B 的选项必须依赖于在 A 中选择的值。即 a->b->c

我只得到菜单 a -> b,而不是 b -> 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 的每一次帮助

【问题讨论】:

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


    【解决方案1】:

    你犯了 3 个错误:

    1. 在 if-else 块“AUSWAHL 2”中键入“.values”而不是“.value”

      (auswahl2.options[auswahl2.selectedIndex].values == "d")

    2. 您尚未在 select auswahl2 上添加处理程序。
    3. 需要写2个函数而不是1个,否则当你改变auswahl2时,他会被覆盖而不存储选择的值。
    <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>

    【讨论】:

    • 哇,这是一个非常大的帮助,谢谢,但是如果我想再放一个菜单,我不知道该怎么做,你能帮我吗?从 3 -> 4
    • 您可以在全局变量中处理 select.value。保留一个函数(而不是我的两个)并仅在前一个 select.value 的值已更改时重新填充 select。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-06-10
    • 2021-07-31
    • 2021-05-04
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多