javascript - AJAX 使用 GET 方法加载 php 文件，加载时未出现某些 jquery 插件

Question

你好，我刚开始学习 AJAX 和 JQuery，也许这是一个愚蠢的问题，但请不要评判我。我创建了实时显示数据，数据加载时没有刷新页面，所以我使用 AJAX，我在 body 标签中加载函数 onload。

我使用图像选择器，不使用 AJAX GET 时看起来不错，

并且分开了我的文件index.html是主文件，我还添加了getdata.php文件显示。

在 index.html 上

<div class="col-xs-8 picker" id="viewdata">
     // content getdata.php here                
</div>

在 script.js 上

function viewdata(){
   $.ajax({
   type: "GET",
   url: "php/getdata.php",
   dataType: "html"
  }).done(function( data ) {
  $('#viewdata').html(data);
  });
}

在 getdata.php 上

<select class="image-picker">
        <?php
            include "config.php";
            $res = $conn->query("select * from images");
            while ($row = $res->fetch_assoc()) {
            ?>
        <option data-img-src="images/<?php echo $row['file_name'];?>" value="<?php echo $row['file_name'];?>"> <?php echo $row['file_name'];?> </option>
        <?php } ?>
    </select>

但是结果变成这样

这就像图像选择器没有加载

对不起，我的英语不好。

Answer 1

您的脚本应如下所示:

function viewdata(){
    $.ajax({
        type: "GET",
        url: "php/getdata.php",
        dataType: "html",
        success: function(data){
            $('#viewdata').html(data);
            $('select').imagepicker(); // to reinitialize the plugin.
        }
        error: function(data){
            // error handling
        }
    }).done(function(data){
        // something to do after, even if it throws an error.
    });
}