Я пытаюсь заполнить div загрузочным gif.Когда пользователь нажимает на кнопку поиска, первой директивой является загрузка GIF.затем выполните ajax и, наконец, замените gif загрузки результатами.То, что я вижу на вкладке сети dev tools, заключается в том, что gif загрузки ожидает до тех пор, пока не будет выполнен вызов ajax, что полностью противоречит цели загрузки gif.без вызова AJAX загрузочный GIF загружается мгновенно.
$('body').on('click', '#searchForDids', function () {
$('#results').html("<img src='images/loading.gif' width='250px'>");
var npa = $('#npa').val();
var nxx = $('#nxx').val();
var consec = $('#consec').val();
var token = $('#_token').val();
$.ajax({
type: "POST",
data: {
'npa': npa,
'nxx': nxx,
'consec': consec,
'_token': token
},
url: "/telnyxSearch",
success: function (result) {
$('#results').html(result);
console.log(result);
}
})
})
Если я заменю
$('#results').html("<img src='images/loading.gif' width='250px'>");
на:
$('#results').html('cat');
Cat появляется мгновенно, так же, какЯ ожидаю загрузки GIF для.Я знаю, что URL к изображению правильный.
Основываясь на повторном голосовании ниже, я посмотрел на Этот ответ :
$('body').on('click','#searchForDids',function(){
var npa = $('#npa').val();
var nxx = $('#nxx').val();
var consec = $('#consec').val();
var token = $('#_token').val();
$.ajax({
type:"POST",
data:{'npa' : npa,
'nxx' : nxx,
'consec' : consec,
'_token' : token},
url:"/telnyxSearch",
beforeSend: function() {
$('#results').html("<img src='images/loading.gif' width='250px'/>");
},
success:function(result){
$('#results').html(result);
console.log(result);
}
})
})
Я все еще получил те же результаты ..
Опять же: если я использую какую-то случайную строку, она работает нормально, она перестает работать, только когда я пытаюсь использовать изображение loading.gif ......