Как выполнять Ajax запрос только для конкретной $(this) кнопки если кнопок много? Сейчас данные загружаются всем кнопкам с классом .loadmore_gs
Использую такой скрипт для вордпресс:
<script type="text/javascript">
jQuery(function($){
$('.loadmore_gs').click(function(){
$('.cssload-container').css({'display' : 'block'});
$(this).text('Загрузка...');
var data = {
'action': 'loadmore',
'query': true_posts,
'page' : current_page
};
$.ajax({
url:ajaxurl,
data:data,
type:'POST',
success:function(data){
if( data ) {
$('.loadmore_gs').text('Показать еще...').before(data);
$('.cssload-container').css({'display' : ''});
current_page++;
if (current_page == max_pages) $(".loadmore_gs").remove();
} else {
$('.loadmore_gs').remove();
}
}
});
});
});
</script>
По ID назначать не вариант т.к. блоков может быть несколько. Как выполнять $('.loadmore_gs').click(function() только при клике на текущую кнопку? Куда ввести переменную var $this = $(this); или что то подобное?
Ответы (1 шт):
Автор решения: Darth KYL
→ Ссылка
например вы можете записать текущий ивент в переменную и потом работать с ним
jQuery(function($){
$('.loadmore_gs').click(function(){
let $this = $(this);
$('.cssload-container').css({'display' : 'block'});
$this.text('Загрузка...');
let data = {
'action': 'loadmore',
'query': true_posts,
'page' : current_page
};
$.ajax({
url:ajaxurl,
data:data,
type:'POST',
success:function(data){
if( data ) {
$this.text('Показать еще...').before(data);
$('.cssload-container').css({'display' : ''});
current_page++;
if (current_page == max_pages) $this.remove();
} else {
$this.remove();
}
}
});
});
});