下拉选择后填充内部 html 代码

Question

我有一个 select:

<form class="form-horizontal" method="post" >

                        <div class="form-group">
                            <label class="control-label col-sm-2">Oyunçu seçin</label>
                            <div class="col-sm-10">
                                <?php $players = select("`id`,`name`","`players`","`id`","ASC")->fetchAll(PDO::FETCH_ASSOC); ?>
                                <select id="player" name="player" class="form-control">
                                    <option value="0">--Oyunçu seçin--</option>
                                <?
                                foreach ($players as $player) {
                                    echo '<option value="'.$player['id'].'">'.$player['name'].'</option>';
                                }
                                ?>
                            </select>
                                <div id="divFileInput"></div>
                            </div>
                        </div>
                    </form>

项目 select 在此 select 中编辑后，新文本框出现：

   $(function(){
        $('#player').change(function(){
            var selections = $("#player :selected");
            var html = '';
            $.each(selections,function(i,item){
                html += ':<div class="form-group"><label class="control-label col-sm-2">Ad</label>' +
                    '<div class="col-sm-10">' +
                    '<input type="text" id="name" name="name" class="form-control"  value="<?= $playerfetch['name'];?>" readonly>' +
                    '</div></div><div class="form-group">' +
                    '<label class="control-label col-sm-2">Kod</label>' +
                    '<div class="col-sm-10">' +
                    '<input type="text" id="code" name="code" class="form-control" readonly>' +
                    '</div></div>'+
                '<div class="form-group"><label class="control-label col-sm-2">Doğum tarixi</label>' +
                  '<div class="col-sm-10">' +
                    '<input type="text" id="birthday" name="birthday" class="form-control" readonly>' +
                    '</div></div><div class="form-group">' +
                    '<label class="control-label col-sm-2">Cins</label>' +
                    '<div class="col-sm-10">' +
                    '<input type="text" id="gender" name="gender" class="form-control" readonly>' +
                    '</div></div>' +
                '<div class="form-group"><label class="control-label col-sm-2">Məşqçi</label>' +
                '<div class="col-sm-10">' +
                '<input type="text" id="trainer" name="trainer" class="form-control" readonly>' +
                '</div></div><div class="form-group">' +
                '<label class="control-label col-sm-2">Çəki</label>' +
                '<div class="col-sm-10">' +
                '<input type="text" id="weight" name="weight" class="form-control" readonly>' +
                '</div>' +
                    '<div class="form-group">' +
                    '<div class="col-sm-offset-2 col-sm-10">'+
                    '<input type="submit" value="Əlavə et">'+
                    '</div>'+
                    '</div>'+
                    '</div>';
            })
            $('#divFileInput').html(html);
        })

现在我想用数据库中的值填充这些文本框，但我遇到了问题。我意识到我需要使用 AJAX，因为 PHP 是一种服务器端语言。我以前从未使用过 AJAX，我可以通过一些修改将 js 脚本转换为 ajax 还是我需要重新编码，它应该是什么样子？

Answer 1

您已经在使用 JQuery，因此不需要任何修改。看起来您需要从数据库中获取数据到您的脚本中。您可以检查 W3SCHOOLS example 但将数据库数据提取到脚本中并不安全。如果您将 JQuery 与 PHP 一起使用，则应将 PHP 用于这些目的。希望你的问题得到解答...

下拉选择后填充内部 html 代码

Populate inner html code after dropdown selection

html

php

ajax

jquery

innerhtml