php - Javascript、克隆、函数和更改 id 和名称，有什么想法吗？

Question

这是我的Javascript：

<script>

        function disable()
        {
            document.getElementById("habits").disabled=true;
            document.getElementById("habits2").disabled=true;

            document.getElementById("exact").disabled=false;
        }
        function enable()
        {
            document.getElementById("habits").disabled=false;
            document.getElementById("habits2").disabled=false;

            document.getElementById("exact").disabled=true;
        }
        var counter =0;
        var i = 0;
        function duplicate() { 
            var original = document.getElementById('div');
            var clone = original.cloneNode(true); // "deep" clone

            i+=1;
            clone.id = "div" + i; // there can only be one element with an ID
            original.parentNode.appendChild(clone);

            document.getElementById('div' + i).getElementsByTagName('select').name += '_clone' + i;
            counter+=1;
        }

    </script>

这是我的 HTML 代码：

 <button id="button" onclick="duplicate()">Add List</button><br><br>
        <form id ="form" name="search" method="post" action="test.php">
            <div id="div">
                <div id="d">
                    <select name ="select" >
                        ...options...
                    </select>
                </div>

                Value:<input type="text" id ="exact">

                From: <input type="text" id="habits">
                To: <input type="text" id="habits2">

                <br>
                <input type="button" name="answer" value="Range" onclick="enable()"  >
                <input type="button" name="answer" value="Exact" onclick="disable()" >
            </div>
            <br><br>

            <input type="submit" name ="search" value="Submit">
        </form>

我的问题是，当我克隆 时div id=div，所有按钮都适用于原始按钮，甚至是克隆的按钮。另一件事是，当我单击提交按钮以从 中获取选项时drop-down list(s)，但提交后，仅计算（克隆）最后一个下拉列表，但我只想要原始的。

这是我点击提交后的页面：

<?php
$item = $_POST["select"];
echo $item;
?>

我该如何解决这个问题？也就是说，更改id's 和名称，以及使用克隆元素的函数？

Answer 1

试试这个。我通过添加一行更改了功能

   function duplicate() { 
                var original = document.getElementById('div');
                var clone = original.cloneNode(true); // "deep" clone

                i+=1;
               clone.attr("id",replace(clone.attr("id"),"div"+i));// change the id of clone div
              //  clone.id = "div" + i; // there can only be one element with an ID
                original.parentNode.appendChild(clone);

                document.getElementById('div' + i).getElementsByTagName('select').name += '_clone' + i;
                counter+=1;
            }

Answer 2

首先，如果你想复制东西，不要使用 id。按类使用和选择（我强烈建议使用jQuery），并使用name="some_name[]"

要解决您的问题，您可以这样做：onclick="javascript:enable(this)"或者，如果您决定使用 jQuery，请使用 `onclick="javascript:jQuery(this)"，然后搜索当前元素的兄弟姐妹（不知道纯 js 语法，只是 jquery 之一，如果您需要 jquery 帮助，请告诉我）。

希望这有帮助，祝你好运。