作成日

前月セッション

更新日

著者

カテゴリ

サマリー

画像URL

公開ステータス

閲覧数

施策紹介（CV率）

ファイル&メディア

ヘルプカテゴリ

作成日時

表示順（前月セッションより）

分類

無料

To-do

In progress

Complete

公開

サブタイトル

pick up

ranking

名前

施策紹介（アクセス数）

施策紹介（客単価）

施策紹介（インバウンド対策）

施策タイプ

開始日

終了日

予算

担当者

進捗状況

フィードバック

優先度

添付ファイル

サムネイル

会社名

マルチセレクト

番号

講座の説明

講師名

受講者数

講座の状態

受講者のフィードバック

講座のカテゴリ

連絡先メールアドレス

<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5NHWVFM"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>いいね/バッド カウンター</title>
<style>
    button {
        margin-right: 10px;
    }
</style>
</head>
<body>
    <h1>いいね/バッド カウンター</h1>
    <button id="likeBtn">いいね</button>
    <span id="likeCount">0</span>
    <button id="dislikeBtn">バッド</button>
    <span id="dislikeCount">0</span>

    <script>
        // いいねボタンのクリック回数
        let likeCount = 0;
        // バッドボタンのクリック回数
        let dislikeCount = 0;

        // いいねボタンのクリック時の処理
        document.getElementById('likeBtn').addEventListener('click', function() {
            likeCount++;
            document.getElementById('likeCount').textContent = likeCount;
            // サーバーにいいねカウントを送信
            sendCountToServer('like', likeCount);
        });

        // バッドボタンのクリック時の処理
        document.getElementById('dislikeBtn').addEventListener('click', function() {
            dislikeCount++;
            document.getElementById('dislikeCount').textContent = dislikeCount;
            // サーバーにバッドカウントを送信
            sendCountToServer('dislike', dislikeCount);
        });

        // サーバーにカウントを送信する関数
        function sendCountToServer(type, count) {
            // サーバーのエンドポイントにPOSTリクエストを送信
            fetch('/update-count', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({
                    type: type,
                    count: count
                })
            })
            .then(response => {
                if (!response.ok) {
                    throw new Error('サーバーエラー');
                }
                return response.json();
            })
            .then(data => {
                console.log(data.message);
            })
            .catch(error => {
                console.error(error.message);
            });
        }
    </script>
</body>
</html>

グロースナビ動画講座

📌 News

🛫 まずはここから

💻 学習コンテンツ

🎥 動画学習コンテンツ

🌟施策事例

多言語翻訳講座

海外ギフティング講座