Question

我使用这个ajax代码来显示选择图像

function get_image(id)
{
var getid=id;
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("in-t").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("GET","<?php echo get_template_directory_uri(); ?>/class/class.image.php?id=" + getid + "&tnow="+ (new Date()).getTime(),true);
xmlhttp.send();
}

当用户点击缩略图时，首先loading.gif show，以及如此大的图像显示in-t id。但我想要第一个完整的加载图像，所以显示。我发现jquery加载功能，但我不知道如何使用它？

Answer 1

如果在代码中使用jquery会更好。在标题中包含以下行

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

并重写函数get_image，如下所示

function get_image(id) {
  var getid=id;
  $("#idOfResultDiv").html('<img src="yourloading.gif" />');
  $.ajax({
    type: 'GET',
    async: false,
    url: '<?php echo get_template_directory_uri(); ?>/class
      /class.image.php?id=' + getid + '&tnow='+ (new Date()).getTime(),true,
    data: str,
    success: function(response) {
        $("#idOfResultDiv").html(response);
    }
   });
   }

由ajax加载的fadein图像

1 个答案: