Кнопка отражает количество кликов на ней

@Destroyerr · Регистрация: 09.12.2015

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

Помогите пожалуйста.
Нужно создать кнопку с надписью "Нажата 0 раз". При нажатии на кнопку, надпись на ней должна изменяться на "Нажата 1 раз", т.е. кнопка должна отображать количество нажатий на неё.

@kalabuni · 18.11.2016, 21:07

HTML5
1
<input type="button" value="Нажата 0 раз" onclick="var t = this.value.split (' '); ++t [1]; this.value = t.join (' ')">

@Alei CD · 21.11.2019, 10:50

Отлично работает, но подскажите, как сделать чтобы после перезагрузки страницы счетчик снова не сбрасывался на ноль, а число сохранялось? Может быть создать файл для сохранения переменной?

@Balanaar · 21.11.2019, 11:26

HTML5
1
<input type="button" onclick="clickCounter()">

JavaScript
1
2
3
4
5
6
7
let clicks = +localStorage.getItem('clicks');
const button = document.querySelector('input[type="button"]');
button.value = `Нажата ${clicks} раз`;
function clickCounter() {
  localStorage.setItem('clicks', ++clicks);
  button.value = `Нажата ${clicks} раз`;
}

@Alei CD · 21.11.2019, 18:04

Balanaar, я не очень понял вашу запись кода что где? можете пояснить? мне надо это вставить на сервер. Должен быть сайт на котором есть кнопка с надписью и количеством нажатий на неё и чтобы после перезагрузки страницы число не сбрасывалось.

@Balanaar · 22.11.2019, 09:19

Alei CD, если вы хотите хранить данные по количеству кликов для каждого отдельного юзера на сервере, то вам надо задействовать БД, серверный язык и сессии, либо куки.

@Alei CD · 22.11.2019, 09:55

Balabaar, я не хочу хранить для отдельного юзера, я хочу от всех кто заходит на страницу. Про БД это точно, но почему-то не получается.

@kalabuni · 22.11.2019, 20:58

Alei CD, в данном случае БД как раз и не нужна -- достаточно будет иметь на сервере текстовой файл, в который программой на PHP будет перезаписываться количество кликов

@Alei CD · 23.11.2019, 09:44

kalabuni, я так и делал, у меня есть файл index.html:

HTML5
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
<!DOCTYPE HTML>
<html>
<head>
<title>Show</title>
<style>
    body {
        background-color: #7FFFD4;
        
        background-attachment: fixed;
        ​​​​​​​​​}
   </style>
</head>
<body>
<center>
<h1>Show</h1>
<h1>Please subscribe to our channel!</h1>
<form action="index.php" method="post">
<input type="submit" name="countBut" value="Subscribe"/>
</form>
<H2>(fast-track)</H2>
<video width = "800" height = "500" poster = "10.jpg" controls>
            <source src = "clean.mp4" type = "video/mp4">
</video>
</body>
</html>

и есть index.php о котором упоминалось раньше:

PHP
1
2
3
4
5
6
7
8
<?php
if(isset($_POST['countBut'])){
    $count = file_get_contents('count.txt');
    $count++; // увеличиваем на еденицу
    file_put_contents('count.txt',$count);
}
else $count = file_get_contents('count.txt');
?>

также есть count.txt в который записывается число. На windows это штука работает на raspberry pi нет, подскажите какие могут быть ошибки? И ещё как сделать чтобы число из файла высвечивалось рядом с кнопкой?

Новые блоги и статьи Все статьи Все блоги /
Учёным и волонтёрам проекта «Einstein@home» удалось обнаружить четыре гамма-лучевых пульсара в джете Млечного Пути Programma_Boinc 01.01.2026 Учёным и волонтёрам проекта «Einstein@home» удалось обнаружить четыре гамма-лучевых пульсара в джете Млечного Пути Сочетание глобально распределённой вычислительной мощности и инновационных. . .	Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Programma_Boinc 28.12.2025 Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / ********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / ********/ gallery/ bKBkQFf Пост отсюда. . .	Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .	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/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .

@Destroyerr 0 / 0 / 0 Регистрация: 09.12.2015 Сообщений: 16

	Кнопка отражает количество кликов на ней 18.11.2016, 20:03. Показов 20851. Ответов 8 Метки нет (Все метки) Помогите пожалуйста. Нужно создать кнопку с надписью "Нажата 0 раз". При нажатии на кнопку, надпись на ней должна изменяться на "Нажата 1 раз", т.е. кнопка должна отображать количество нажатий на неё. 0

@Alei CD 0 / 0 / 0 Регистрация: 21.11.2019 Сообщений: 8
	21.11.2019, 10:50
	Отлично работает, но подскажите, как сделать чтобы после перезагрузки страницы счетчик снова не сбрасывался на ноль, а число сохранялось? Может быть создать файл для сохранения переменной? 0

@Alei CD 0 / 0 / 0 Регистрация: 21.11.2019 Сообщений: 8
	21.11.2019, 18:04
	Balanaar, я не очень понял вашу запись кода что где? можете пояснить? мне надо это вставить на сервер. Должен быть сайт на котором есть кнопка с надписью и количеством нажатий на неё и чтобы после перезагрузки страницы число не сбрасывалось. 0

@Balanaar 2463 / 1769 / 625 Регистрация: 11.07.2016 Сообщений: 4,067
	22.11.2019, 09:19
	Alei CD, если вы хотите хранить данные по количеству кликов для каждого отдельного юзера на сервере, то вам надо задействовать БД, серверный язык и сессии, либо куки. 0

@Alei CD 0 / 0 / 0 Регистрация: 21.11.2019 Сообщений: 8
	22.11.2019, 09:55
	Balabaar, я не хочу хранить для отдельного юзера, я хочу от всех кто заходит на страницу. Про БД это точно, но почему-то не получается. 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	22.11.2019, 20:58
	Alei CD, в данном случае БД как раз и не нужна -- достаточно будет иметь на сервере текстовой файл, в который программой на PHP будет перезаписываться количество кликов 0

Кнопка отражает количество кликов на ней

Решение