Проект. Камень Ножницы Бумага

@HeadeR555 · Регистрация: 26.06.2013

Студворк — интернет-сервис помощи студентам

Просьба помочь разобраться, не знаю как сделать дальше с JQuery чтобы заполнялся лог ( т.е все события, player: rock AI: paper и т.д ) Нужно чтобы при нажатии на кнопку менялся src картинки (вместо знака вопроса ).
index.html:

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<!doctype html>
<html>
    <head>
        <title>Rock Paper Scissors</title>
        <meta charset="utf-8">
        <link href="styles/style.css" rel="stylesheet" type="text/css">
        <script src="scripts/jquery-3.1.1.min.js"></script>
    </head>
    <header>
        <h1>Rock, Paper and Scissors</h1>
        <h2>Player vs Computer</h2>
    </header>
    <body>
        <br>
        <br>
        <br>
        <br>
        <br>
        <br>
        <div id="question">
            <br>
            <br>
            <br>
            <h1>Are you ready to play ?</h1>
            <br>
            <br>
            <button id="StartButton" onclick = "opengame()">Start Game</button>
            <button id="block">I'm not ready yet</button>
        </div>
        <div id="place">
            <h1>Make your choice !</h1>
            <div id="buttons">
                <button class="option" id="rock"><input type="image" src="https://www.cyberforum.ru/images/rockRight.png" /></button>
                <button class="option" id="paper"><input type="image" src="https://www.cyberforum.ru/images/paperRight.png" /></button>
                <button class="option" id="scissors"><input type="image" src="https://www.cyberforum.ru/images/scissorsRight.png" /></button>
                <button id="resetButton">Reset</button>
                <br>
                <br>
                <br>
                <br>
            </div>
            <div class="board">
                <img class="player" src="https://www.cyberforum.ru/images/question.gif" id="playerquestion">
                <img src="https://www.cyberforum.ru/images/player.png" id="pcicon">
            </div>
            <div class="board">
                <table class = "results">
                        <tr>
                            <td id="titleofwins"> WINS </td>
                            <td id="titleofties"> TIES </td>
                            <td id="titleoflossess"> LOSSESS </td>
                        </tr>
                        <tr>
                            <td id="wins"> 0 </td>
                            <td id="ties"> 0 </td>
                            <td id="loses"> 0 </td> 
                        </tr>
                </table>
            </div>
            <div class="board">
                <img class="pc" src="https://www.cyberforum.ru/images/question.gif" id="pcquestion">
                <img src="https://www.cyberforum.ru/images/pc.png"
                id="playericon">
            </div>
            <div id="winner">
                    <p>Let's see, can a mere human beat me ?</p>
            </div>
            <div id="log">
                <p>Let's see logs</p>
                <p>Let's see logs</p>
                <p>Let's see logs</p>
                <p>Let's see logs</p>
                <p>Let's see logs</p>
            </div>
        </div>
        <footer>
            <h2>Denis Danilin</h2>
            <h2>154816IABB31</h2>
        </footer>
        <script src="scripts/app.js"></script>
    </body>
</html>

script:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
function ComputerMove() {
    var randomNumber = Math.random();
    if (randomNumber < 0.33) {
        $("#pcquestion").attr('src', images2[0]);
        return "rock";
    } else if (randomNumber < 0.66) {
        $("#pcquestion").attr('src', images2[1]);
        return "paper";
    } else {
        $("#pcquestion").attr('src', images2[2]);
        return "scissors";
    }
}
 
function getComputerMove() {
    
    var randomNumber = Math.random();
    if (randomNumber < 0.33) {
        return "rock";
    } else if (randomNumber < 0.66) {
        return "paper";
    } else {
        return "scissors";
    }
}
 
function getWinner(playerMove,ComputerMove) {
    var winner;
    
    if (playerMove===ComputerMove){
        winner = 'tie';
    }
    else if (playerMove==="rock") {
        if(ComputerMove==="paper"){
            winner = "computer";
        } else {
            winner = "player";
        }
    }
    else if (playerMove==="paper") {
        if (ComputerMove==="scissors") {
            winner = "computer";
        } else {
            winner = "player";
        }
    }
    else if (playerMove==="scissors") {
        if (ComputerMove==="rock") {
            winner = "computer";
        } else {
            winner = "player";
        }
    } else {
        winner = "error";
    }
 
    return winner;
}
 
function playOnce(playerMove, ComputerMove) {
    var winner = getWinner(playerMove, ComputerMove);
    
    winner = getWinner(playerMove, ComputerMove);
    
    
    if(winner==="player" || winner==="computer") {
        $('#winner').html("<p>" + winner.toUpperCase() + "won this round !" + "</p>");
    } else {
        $('#winner').html("<p>It's a TIE!</p>");
    }
    
    return winner;
    
}
 
var images = ["https://www.cyberforum.ru/images/rockLeft.png", "https://www.cyberforum.ru/images/paperLeft.png", "https://www.cyberforum.ru/images/scissorsLeft.png"];
var images2 = ["https://www.cyberforum.ru/images/rockRight.png", "https://www.cyberforum.ru/images/paperRight.png", "https://www.cyberforum.ru/images/scissorsRight.png"];
 
$(document).ready(function() {
    $("#place").hide();
    $("#StartButton").click(function() {
        $("#question").hide();
        $("#place").show();
    })
    
    var playerScore = 0;
    var computerScore = 0;
    var tieScore = 0;
    
    $('.option').click(function() {
        var playerMove = $('.option input').attr('src');
        var computerMove = getComputerMove();
        var winner = playOnce(playerMove, computerMove);
        
        if (winner==="tie") {
            tieScore += 1;
            $('#playerquestion').attr('src', playerMove);
        } else {
            // To be continued
        }
    })
});

@vettel · 19.11.2016, 15:29

Сообщение от HeadeR555

Нужно чтобы при нажатии на кнопку менялся src картинки

Вы слишком много кода показываете, разбираться в нем не хочется. Попробуйте выделить из него то, что вам нужно и что не получается.
Касательно вопроса в целом - на jQuery это реализуется как-то так:

JavaScript
1
2
3
$('нужный button').click(function() {
    $('нужная картинка').attr('src', 'нужный src');
});

Новые блоги и статьи Все статьи Все блоги /
PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Access VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .	Ломающие изменения в C#.NStar Alpha Etyuhibosecyu 20.11.2025 Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .	Мысли в слух kumehtar 18.11.2025 Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .	Создание Single Page Application на фреймах krapotkin 16.11.2025 Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .