Javascript - 连续显示/克隆下拉列表

时间:2017-08-23 17:22:42

标签: javascript

我需要创建多个相同的下拉列表,只有第一个可见,当填充时,下一个显示。

我找到了一些示例并使其成为第二个仅在第一个填充之后显示,但我无法创建适用于所有列表的代码(不复制所有内容)。我不是程序员,但我可以看到例子并且有点适应它们。

任何人都可以帮助我吗?

这就是我使用的:

$testsql = "INSERT INTO table1 (name) VALUES ('".$arry."')";

https://jsfiddle.net/mbus6w11/6/

1 个答案:

答案 0 :(得分:1)

这就是我的建议: 在div中选择每个元素并为每个元素分配一个ID, 为所有选择元素添加onChange函数(可以保留最后一个) 在您的脚本中,将第二个和第三个div的可见性设置为false, 在onChange函数中,将下一个select元素的可见性设置为true。

以下是代码:

    <div id = "first">
       <select onchange="myFunction1()">
           <option value="volvo">Volvo</option>
           <option value="saab">Saab</option>
       </select> 
    </div>

    <div id = "second">
       <select onchange="myFunction2()">
           <option value="volvo">Volvo</option>
           <option value="saab">Saab</option>
       </select> 
    </div>

    <div id = "third">
       <select>
          <option value="volvo">Volvo</option>
          <option value="saab">Saab</option>    
       </select>
    </div> 

使用Javascript:

    document.getElementById("second").style.visibility = "hidden";
    document.getElementById("third").style.visibility = "hidden";

    function myFunction1() {
        document.getElementById("second").style.visibility = "visible";
    }

    function myFunction2() {
        document.getElementById("third").style.visibility = "visible";    
    }