#javascript #php #onclick #increment #decrement
#javascript #php #onclick #увеличение #уменьшение
Вопрос:
У меня есть кнопка «нравится / не похоже» и поле «Количество лайков», и оно отображает переменную, которая получает количество лайков следующим образом:
PHP-HTML:
<span>likes: <?php echo $row['likes'];?></span>
<button type="submit" class="btn btn-custom btn-sm liketoggle" name ="like">
//Printing 'Like' if its been liked by user, and 'Unlike' if not liked by user
<? $qid = $row['Question_ID']; $query2 = "SELECT * FROM likes WHERE
user_id='$user_id' and qid = '$qid'";
$results2 = mysqli_query($con,$query2);
if(mysqli_num_rows($results2) == 0){ echo '<span>Like</span>';}
else{echo '<span>Unlike</span>';}?></button>
Javascript — Для переключения типа «нравится» / «не похоже»:
$(".liketoggle").click(function () {
$(this).find("span").text(function(i, v){
return v === 'Like' ? 'Unlike' : 'Like'
return v === 'Unlike' ? 'Like' : 'Unlike'
})
});
Есть ли способ увеличить количество лайков ($ row [‘likes’]), когда пользователь нажимает «Нравится», и таким же образом уменьшается, когда не нравится?
Комментарии:
1. Добро пожаловать в SO. Короче говоря, нет. Вы пытаетесь смешать код на стороне сервера и js-код. Вам нужно было бы отправить новую переменную на сервер, чтобы она отображала новую страницу, или вы могли бы реализовать ajax или что-то динамическое в этом роде. лучшим подходом было бы создать конечную точку rest, чтобы вы могли вызывать ее в любое время, когда захотите увеличить или уменьшить значение.
2. AJAX — довольно широкая тема, но основы довольно просты с jQuery. Найдите
$.post
информацию о том, что вам нужно сделать. Используйте AJAX и загляните в JSON и json_decode для получения дополнительной информации на стороне сервера. JSON — это просто объектная нотация JavaScript. По сути, это способ кодирования структурированных данных, чтобы их можно было передавать в запросе we на сервер и обратно при использовании AJAX. JSON в основном заменяет X в AJAX (асинхронность JavaScript и XML), но вряд ли кто-то использует XML в наши дни. XML, как и JSON, является способом передачи структурированных данных, но он больше похож на HTML (HTML является производным от XML)3. Плюс AJAX звучит лучше, чем AJAJ … lol. Не бойтесь публиковать другой вопрос или искать AJAX на страницах stack overflow, если вы застряли. Когда вы перейдете к ее обновлению, вы можете сделать что-то вроде этого
REPLACE INTO likes SET like=0 WHERE question_id=? AND user_id=?
с помощью replace, вам не нужно выбирать между insert и update, если ваши строки уникальны. dev.mysql.com/doc/refman/8.0/en/replace.html4. AJAX выполняет свою работу, обновляя лайки в базе данных, но количество лайков остается неизменным во внешнем интерфейсе, и я хочу, чтобы это число увеличивалось без обновления страницы. @ArtisticPhoenix
5. Как я могу использовать $.post в этом случае? @ArtisticPhoenix
Ответ №1:
Вы можете использовать js для изменения числа.
<span>likes: <span class="likes-count"><?php echo $row['likes'];?></span></span>
<button type="submit" class="btn btn-custom btn-sm liketoggle" name ="like">
//Printing 'Like' if its been liked by user, and 'Unlike' if not liked by user
<?php $qid = $row['Question_ID']; $query2 = "SELECT * FROM likes WHERE
user_id='$user_id' and qid = '$qid'";
$results2 = mysqli_query($con,$query2);
if(mysqli_num_rows($results2) == 0){ echo '<span>Like</span>';}
else{echo '<span>Unlike</span>';}?></button>
JS:
$(".liketoggle").click(function () {
$(this).find("span").text(function(i, v){
return v === 'Like' ? 'Unlike' : 'Like'
return v === 'Unlike' ? 'Like' : 'Unlike'
});
var likes = $('.likes-count').text();
likes = likes ? parseInt(likes) : 0;
if($(this).find("span").text() == 'Like') likes ;
else if(likes > 0) likes--;
$('.likes-count').text(likes);
});
Комментарии:
1. Увеличивающие десятичные числа и не увеличивающиеся на 1. Пожалуйста, сообщите.
2. Вы должны знать, какое число является
like
, чтобы использовать мой метод. В противном случае вам нужно будет выполнить вызов ajax для вычисления лайков перед их печатью.3. Как это возможно с AJAX? Я не очень знаком с AJAX, как я могу вызвать это в моем случае?