Question

我有这个javascript函数。我想在div加载时显示图像加载。如果div已加载或出现错误，则将loadking图像设置为null：

按原样，加载图片一直显示在页面上，任何想法在这里缺少什么？

$(document).ready(function(){

  $("#submitbutton").on("click", function(){
    //disable the button to prevent multiple clicks
    $("#submitbutton").attr("disabled", "disabled");
    $('#loading').html('<img src="img/loading.gif"> loading...');

    var vcenter = $("#v_name").val();

    vcenter = "'"+vcenter+"'";


    var req = ocpu.rpc("output1", {
      vcenter : vcenter

    }, function(output){

      var data=output;

      });

      req.fail(function(){
        alert("Server error: " + req.responseText);
        $('#loading').html();
      });

      //after request complete, re-enable the button 
      req.always(function(){
        $("#submitbutton").removeAttr("disabled");
         $('#loading').html();
      });

    });
  });

html代码：

<button id="submitbutton" type="button">Submit</button>
  <div id="loading"></div>

  <div id="output"> </div>

Answer 1

你需要清空它。

$('#loading').html('');

这是您当前问题的解决方法。不过我建议的是这样的：

    $(document).ajaxStart(function () {
        $('#loading').css('display', 'block');
    }).ajaxStop(function () {
        $('#loading').css('display', 'none');
    });

#loading div包含来自HTML的图片。

如何使用javascript启用图像加载和禁用它

1 个答案: