let a1 = document.getElementById('tab1');
let a2 = document.getElementById('tab2');
let a3 = document.getElementById('tab3');
let b1 = document.getElementById('tab4');
let b2 = document.getElementById('tab5');
let b3 = document.getElementById('tab6');
let c1 = document.getElementById('tab7');
let c2 = document.getElementById('tab8');
let c3 = document.getElementById('tab9');
let tabs = [];
tabs = [
a1, a2, a3,
b1, b2. b3,
c1, c2, c3,
]
let random = Math.round(Math.random() * 7);
tabs[random].addEventListener('click', lose);
function lose(){
tabs[random].style.backgroundColor = 'red';
alert('You lose!')
location.reload()
}
JavaScript
Помогите с кодом js
хочу создать игру типа сапера где будет поле 3 на 3 и в случайной ячейке поля будет бомба, по нажатию на которую игрок проигрывает. Скрипт весь написал но хочу узнать как сделать чтобы после нажатия на бомбу ячейка становилась красной? вот мой код но он работает не так как надо
Добрый день, код работает неправильно, потому что та же самая функция, что меняет стиль клетки, ещё и сразу же перезагружает страницу. Может, перезагрузку обернуть в timeout?
function lose(){
tabs[random].style.backgroundColor = 'red';
alert('You lose!')
setTimeout(()=>{
location.reload()
}, 1000)
}
Серёга Седачев
Все равно так же( Сначала всплывает алерт а потом уже меняется стиль хотелось бы наоборот
Серёга Седачев
Спасибо большое за ответ! Решил проблему вот этим кодом
- Решением твоей проблемы будет выкинуть нафиг свой alert со всплывающим сообщением, и вместо этого выводить информацию иначе. Да тут даже выводить ничего не надо. Обычный грустный смайлик, а также демонстрация всех бомб на карте. Подобные всплывающие окна будут только раздражать игроков.
- А если тебе захочется увеличить поле, ты будешь ещё добавлять getElementById? Почитай про Open-Closed принцип проектирования. Добавь какой-нибудь цикл и не парься.
- У тебя изначально должна быть адекватная игровая модель, которой в коде не видно. В данном случае это набор ячеек, за которыми стоит информация, является ли ячейка бомбой. Для упрощения программирования можно даже использовать двумерный массив, так как в данном случае более наглядно и проще определять соседние клетки.
https://codepen.io/norbert123/pen/GRwgwOq написал на коленке игрушку с одной миной в случайном положении
У тебя код написан слишком брутально, его нужно исправить в некоторых местах. Во-первых: у тебя тонна кода для каждой ячейки. Добавляй им не разные классы, а один и делай примерно так:
И финальная функция
const tabs = document.querySectorAll('tab');
И ты уже получил свой массив с каждой клеткой. А обращаться к ячейке можешь по индексу: let random = Math.floor(Math.random() * 9);
tabs[random].addEventListener('click', lose);
И все! Мы заменили твою писанину 3 строчками! И html у тебя не пестрит разнообразными классами!И финальная функция
tabs[random].style.background = 'red';
alert('Поражение');
У тебя срабатывает перезагрузка страницы сразу же, я ее убрал отсюда. Придумай что то получше alert, узнай как делать модальные окна.Похожие вопросы
- Помогите с кодом JS. Как в данном случае вывести сообщение о равных числах?
- Помогите, пожалуйста, написать js код для обновления ссылки
- Ребят помогите с кодом пожалуйста (JS, Googl Apps Sсript)
- Помогите написать код на JS
- Помогите отзеркалить код для слайдерра (мне сказали просто отзеркалить)! в main.js
- Помогите с кодом Javascript
- Помогите решить в JS
- Можете помочь с API JS
- Помогите подправить код рисовалки на JavaScript
- Помогите с кодом JavaScript