Question

好的，这有点复杂。基本上我用数组填充选择。然后，我想创建另一个选择，并再次使用相同的数组填充它。我相信在创建新选择时没有正确调用populate函数，但是我找不到何时调用它来填充创建的select。

第一：我查询我的数据库以获取一些成员名称，并使用json_encode生成数组，以创建一个json数组。

    $result_array = Array();
    while($stmt->fetch()) {
        $result_array[] = $name;
    }
    $json_array = json_encode($result_array);

然后我将该数组回显到一个javascript数组，并用结果填充一个select标签。所有这些都发生在窗口加载上。

<script>
    var members = <?php echo $json_array; ?>;
    function populate()
    {
        var sel = document.getElementById('members');
        var fragment = document.createDocumentFragment();
        members.forEach(function(member, index) {
            var opt = document.createElement('option');
            opt.innerHTML = member;
            opt.value = member;
            fragment.appendChild(opt);
        });
        sel.appendChild(fragment);
    }
    window.onload = populate;
</script>

包含select：

的html div

<div id="Members">
    <select id="members"></select>
</div>
<input type="button" value="+" onClick="addInput('Members'); populate();">

然后我使用另一个脚本来创建更多div

<script>
    var counter = 1;
    var limit = 3;

    function addInput(divName)
    {
        if (counter == limit)  
        {
            var message = document.getElementById("linkLimit");
            message.innerHTML = "Maximum amount of links reached";
        }
        else
        {
            var newdiv = document.createElement('div');
            newdiv.innerHTML = "<select id='members'></select>";
            document.getElementById(divName).appendChild(newdiv);
            counter++;
        }
    }
</script>

但是，实际上从未填充结果选择。我认为populate函数没有被正确调用，但是我找不到何时调用它来填充创建的select。

或者，对于静态数量的选择输入，我尝试了

<div id="Members">
    <select id="members" name="members"></select>
    <select id="members1" name="members"></select>
    <select id="members2" name="members"></select>
</div>

~~但同样，只填充了第一个选择~~

通过使用for循环并通过数组提供成员，members1，members2，所有三个列表都被填充，但是，这不是那么有用，因为我不知道用户想要选择多少个成员

创建由js数组填充的多个select

0 个答案: