Question

我现在可以让加载程序使用代码 - 但它不会替换并调用URL。所以应该在可搜索范围内调用ajax url调用：

<button onclick="myFunction()">LOAD</button><br /><br />
<div class="spinner bar hide">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<div class="searchtable"><?php include 'hotels/hotelList.php';?></div>
<script>
function myFunction() { 
$('.searchtable').addClass('hide');
$('.spinner').removeClass('hide');

$.ajax({
url: 'hotels/hotelSortBy.php?name=<?php echo $name;?>&arrival=<?php echo $arrival;?>&departure=<?php echo $departure;?>&guests=<?php echo $numberOfGuests;?>'
})

.done(function() {
$('.spinner').addClass('hide');
$('.searchtable').removeClass('hide');
});

}
 </script>

Answer 1

我会提出一些建议：

请勿使用ID，请使用类。
请勿使用.hide＆amp; .show Paul Irish有一个很好的解释here.
从jq 1.7开始，你真的不应该使用.bind()。
我建议使用.ajax()代替.load() see docs

那么你的函数看起来就像

function myFunction() {

  $('.search-table').addClass('hide');
  $('.spinner').removeClass('hide');

  $.ajax({
    url: 'path/to/endpoint'
  })
  .done(function() {
    $('.spinner').addClass('hide');
    $('.search-table').removeClass('hide');
  });

}

使用jsbin示例here.

ajax调用的jQuery Loader

1 个答案: