Как проверить повторный клик?

Question

[Сергей Петров]

есть код, при клике меняется значение

echo '<div class="like">';
					if(какое то условие ){
							echo '<div class="Like_act" data-id="'.$posting['id'].'">5</div>';	   
		   				}else{
							echo '<div class="Like_bck" data-id="'.$posting['id'].'">5</div>';		   				
		   				}
echo '</div>';

$(document).ready(function() {
    $(".like").bind("click", function(event) {
    	var linc = $(this);
   	var dit = $(this).attr("data-id");    
      $.ajax({
        url: "ajaxLike.php",
        type: "POST",
        data: ("id=" +dit),
        dataType: "text",
        success: function(result) {
        	linc.addClass('Like_act');
         linc.text(Number(linc.text()) + 1);
        }
        
      });
    });
  });

меняет значение хорошо, не могу разобраться как сделать чтоб при повторном клике значение также отправлялось но менялось на исходное значение тоесть это - 1 и замена linc.addClass('Like_act');

Comments

[Павел Корнилов]

Таким образом не получится проверить, был ли клик. А если юзер страницу перезагрузит?
Нужно сохранять действие, скажем, в кукисы, но это тоже не надёжный вариант, поскольку кукисы можно удалить.
Подобные проверки делаются только с серверной стороны.

[Сергей Петров]

Павел Корнилов, 1 клик отправляется на сервер и сохраняется, после перезагрузки отображается Like_act, проблема в том если еще раз кликнуть то без перезагрузки на клиентской стороне происходит +1 , но после перезагрузки -1, т.к обрабодчик очищает данные на сервере при повторном.
как сделать чтоб при повторном клике на клиентской стороне было -1

[Сергей Петров]

Павел Корнилов,

я могу обращаться по отдельности

$(document).ready(function() {
    $(".Like_bck").bind("click", function(event) {
    	var linc = $(this);
   	var dit = $(this).attr("data-id");    
      $.ajax({
        url: "ajaxLike.php",
        type: "POST",
        data: ("id=" +dit),
        dataType: "text",
        success: function(result) {
        	linc.addClass('Like_act');
         linc.text(Number(linc.text()) + 1);
        }
        
      });
    });
  });


  $(document).ready(function() {
    $(".Like_act").bind("click", function(event) {
    	var linc = $(this);
   	var dit = $(this).attr("data-id");    
      $.ajax({
        url: "ajaxLike.php",
        type: "POST",
        data: ("id=" +dit),
        dataType: "text",
        success: function(result) {
        	linc.addClass('Like_bck');
         linc.text(Number(linc.text()) - 1);
        }
      });
    });
  });

но после первого клика +1, и если не перезагружать страницу то при повторном клике все равно +1

[Павел Корнилов]

Александр Захаров, а если перезагрузить? Я же говорю: на клиенте подобные проверки не делаются. А если и делаются, то как дополнительные к серверным.

Answer 1

[FeST1VaL]

А почему не сделать просто

<div class="like__box">
	<div class="like"></div>
</div>

в php изначально ставите нужный вам класс, далее просто проверяете класс

$('.like').click(function() {
	if($(this).hasClass('Like_act')) {
		//... тут ваши Ajax запросы)
	} else {
		//... тут ваши Ajax запросы)
	}
})

Comments

[Сергей Петров]

подскажите в чем проблема
если с 0 то сначала идет -1 затем 0-1-2-3-4-5
если с 1 то сначала идет 0 затем 1-2-3-4

$('.like').click(function() {
  if($(this).hasClass('Like_bck')) {
		var linc = $(this);
   	var dit = $(this).attr("data-id");    
      $.ajax({
        url: "ajaxLike.php",
        type: "POST",
        data: ("id=" +dit),
        dataType: "text",
        success: function(result) {        	
        	linc.addClass('Like_act');
         linc.text(Number(linc.text()) + 1);
        }
        
      });
  } else {
  		$(this).hasClass('Like_act');
      var linc = $(this);
   	var dit = $(this).attr("data-id");    
      $.ajax({
        url: "ajaxLike.php",
        type: "POST",
        data: ("id=" +dit),
        dataType: "text",
        success: function(result) {
        	linc.addClass('Like_bck');
         linc.text(Number(linc.text()) - 1);
        }
      });
  }
})

[FeST1VaL]

Александр Захаров, Ну потому что с логикой неправильно тк вы наверняка не повесили сразу нужный класс + вы не удаляете класс. А так же смешиваете JS и jQuery
Примерно так получается.

[Сергей Петров]

Артем Будин, помогло но в случае если исходное значение не 0 а более, то скрипт сбрасывает все до 1 либо до 0

[FeST1VaL]

Александр Захаров, ну проверяйте что у вас там такое происходит) Тк в моем скрипте все нормально)

Answer 2

[Vitsliputsli]

У вас же +1 это like_act, а -1 это like_bck? Вот и проверяйте наличие/отсутствие класса.

Comments

[Сергей Петров]

нет при клике на .like
+1 и включаются стили css like_act
нужно чтоб при повторном нажатии .like
-1 и css like_bck

[Vitsliputsli]

Без разницы, определитесь что у вас будет хранить состояние и ориентируйтесь на это.