При клике на like должна меняться не только картинка, но и число рядом с ней: лайкаете — увеличивается на 1, дизлайкаете — уменьшается на 1. При клике на share должно увеличиваться число ряд

Вопрос пользователя:

При клике на like должна меняться не только картинка, но и число рядом с ней: лайкаете — увеличивается на 1, дизлайкаете — уменьшается на 1. При клике на share должно увеличиваться число рядом: 10 раз нажали на share — +10. Если количество лайков, share или просмотров перевалило за 999, должно отображаться 1K и т. д., а не 1 000. Предыдущие функции должны работать: если у поста было 999 лайков и вы нажали like, то должно стать 1К, если убрали лайк, то снова 999. Обратите внимание: 1.1К отображается по достижении 1 100. После 10К сотни перестают отображаться. После 1M сотни тысяч отображаются в формате 1.3M.

Ответ нейросети:

Пройдите быструю авторизацию для просмотра:

Пример кода для реализации описанной функциональности:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Like and Share Counter</title>
<style>
    .counter {
        display: inline-block;
        margin-right: 10px;
    }
</style>
</head>
<body>
<div class="post">
    <img src="like.png" alt="Like" class="like" onclick="like()">
    <span class="counter" id="likeCounter">0</span>
    <img src="share.png" alt="Share" class="share" onclick="share()">
    <span class="counter" id="shareCounter">0</span>
</div>

<script>
    let likeCount = 0;
    let shareCount = 0;

    function like() {
        likeCount++;
        document.getElementById("likeCounter").textContent = formatCount(likeCount);
    }

    function share() {
        shareCount += 10;
        document.getElementById("shareCounter").textContent = formatCount(shareCount);
    }

    function formatCount(count) {
        if (count >= 1000 && count < 10000) {
            return (count / 1000).toFixed(1) + "K";
        } else if (count >= 10000 && count < 1000000) {
            return (count / 1000).toFixed(0) + "K";
        } else if (count >= 1000000) {
            return (count / 1000000).toFixed(1) + "M";
        } else {
            return count;
        }
    }
</script>
</body>
</html>

Этот код создает простую HTML-страницу с двумя кнопками (like и share) и счетчиками для них. Функции like() и share() увеличивают счетчики и обновляют текст на странице. Функция formatCount() форматирует число в соответствии с требуемыми условиями.

Напишите нам, если в вопросе есть ваши персональные данные (yasnoponyatno24@yandex.ru)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Like and Share Counter</title>
<style>
    .counter {
        display: inline-block;
        margin-right: 10px;
    }
</style>
</head>
<body>
<div class="post">
    <img src="like.png" alt="Like" class="like" onclick="like()">
    <span class="counter" id="likeCounter">0</span>
    <img src="share.png" alt="Share" class="share" onclick="share()">
    <span class="counter" id="shareCounter">0</span>
</div>

<script>
    let likeCount = 0;
    let shareCount = 0;

    function like() {
        likeCount++;
        document.getElementById("likeCounter").textContent = formatCount(likeCount);
    }

    function share() {
        shareCount += 10;
        document.getElementById("shareCounter").textContent = formatCount(shareCount);
    }

    function formatCount(count) {
        if (count >= 1000 && count < 10000) {
            return (count / 1000).toFixed(1) + "K";
        } else if (count >= 10000 && count < 1000000) {
            return (count / 1000).toFixed(0) + "K";
        } else if (count >= 1000000) {
            return (count / 1000000).toFixed(1) + "M";
        } else {
            return count;
        }
    }
</script>
</body>
</html>

ЯсноПонятно24

Пройдите быструю авторизацию для просмотра:

Пройдите быструю авторизацию для просмотра:

Последние вопросы: