jquery loader第二次没有出现

Question

我打电话给装载机，直到响应来自服务器端。问题是第一次运行上传文件后，当我第二次上传它时，装入程序没有来。 我是新来的jquery请帮我。 这是一个代码片段

<form id="myForm" action="upload.php" method="post" enctype="multipart/form-data"> 
    <input id="doc" class="file" type="file" name="xls" data-min-file-count="1"> 
    <br> 
    <button type="submit" class="btn btn-primary">Submit</button> 
    <button type="reset" id="asd" class="btn btn-default">Reset</button> 
</form> 
<hr> 

<div class="panel panel-default"> 
    <div class="panel-heading">The suggestions will appear Here</div> 
    <div class="panel-body" id="output1"> 
    <img id="loader" src="30.gif" /> 
    </div> 
</div> 

<script> 
    $("img#loader").hide(); 
    $("#doc").fileinput({ 
    'allowedFileExtensions': ['xls'], 
    }); 

    $(document).ready(function() { 

    $("#asd").click(function() { 
     $("#output1").empty(); 
    }); 
    var options = { 
     target: '#output1', 
     beforeSubmit: function() { 
     $("img#loader").show(); 
     alert("hinnh"); 
     }, 
     success: function() { 
     $("img#loader").hide(); 
     } 
    } 

    $('#myForm').ajaxForm(options); 
    }); 
</script> 

Answer 1

您不应该清空output1 div。只需更新$("#asd").click - 具有以下代码的功能。

$("#asd").click(function(){ 
    $("#output1").html('<img id="loader" src="30.gif" />'); 
    $("img#loader").hide(); 
    }); 

OR

$(document).ready(function() { 

$("#asd").click(function() { 
    $("#output1").empty(); 
}); 
var options = { 
    target: '#output1', 
    beforeSubmit: function() { 
    $("#output1").html('<img id="loader" src="30.gif" />'); 
    alert("hinnh"); 
    }, 
    success: function() { 
    $("img#loader").hide(); 
    } 
} 

$('#myForm').ajaxForm(options); 
});