Задать вопрос
@Tempest99

Выдает Cannot set property при вводе в промте,как устранить?

При нажатии кнопки "Открыть магазин" появляется промт с вопросом "Ваш бюджет?". При вводе данные должны отобразиться в строке "Бюджет магазина:" , но когда я ввожу цифры выдает ошибку - Cannot set property 'textContent' of undefined at HTMLButtonElement.open.addEventListener . В чем проблема?

<!DOCTYPE html>
<html lang="ru">
  <head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Java Script</title>
  </head>
  <body>

	<div class="open">
		<button class="open-btn" id="open-btn">Открыть магазин</button>
	</div>
	<div class="main">
		<div class="main-info">
			<div class="name">Название магазина: </div>
			<div class="name-value"></div>

			<div class="budget">Бюджет магазина: </div>
			<div class="budget-value"></div>

			<div class="goods">Категории товаров: </div>
			<div class="goods-value"></div>

			<div class="items">Наименования товаров: </div>
			<div class="items-value"></div>

			<div class="employers">Сотрудники: </div>
			<div class="employers-value"></div>

			<div class="discount">Дисконтная система </div>
			<div class="discount-value"></div>

			<div class="isopen">Открыто </div>
			<div class="isopen-value"></div>
		</div>
		<div class="main-functions">
			<div class="choose-goods">Введите категории товаров</div>
			<input class="goods-item" type="text" id="goods_1">
			<input class="goods-item" type="text" id="goods_2">
			<input class="goods-item" type="text" id="goods_3">
			<input class="goods-item" type="text" id="goods_4">
			<button class="goods-item-btn">Утвердить</button>

			<div class="choose-items">Введите продукты через запятую</div>
			<input class="choose-item" type="text" id="items">

			<div class="time">Сколько сейчас времени?</div>
			<input class="time-value" type="text" id="time">

			<div class="count-budget">Расчет дневного бюджета</div>
			<input class="count-budget-value" type="text" id="budget">
			<button class="count-budget-btn">Рассчитать</button>

			<div class="hire-employers">Имена сотрудников</div>
			<input class="hire-employers-item" type="text" id="employers_1">
			<input class="hire-employers-item" type="text" id="employers_2">
			<input class="hire-employers-item" type="text" id="employers_3">
			<button class="hire-employers-btn">Нанять</button>
		</div>
	</div>


	<link rel="stylesheet" href="css/style.css">

	
  </body>
  <script  src="script.js">	</script>
</html>


let open = document.getElementById('open-btn'),
	name_value = document.getElementsByClassName('name-value')[0],
	budget_value = document.getElementsByClassName('budget_value')[0],
	goods_value = document.getElementsByClassName('goods_value')[0],
	items_value = document.getElementsByClassName('items_value')[0],
	employers_value = document.getElementsByClassName('employers_value')[0],
	discount_value = document.getElementsByClassName('discount_value')[0],
	isopen_value = document.getElementsByClassName('isopen_value')[0],

	goods_item = document.getElementsByClassName('goods_item'),
	goods_btn = document.getElementsByTagName('button')[1],
	budget_btn = document.getElementsByTagName('button')[2],
	employers_btn = document.getElementsByTagName('button')[3],
	choose_item = document.querySelector('choose-item'),
	time_value = document.querySelector('time_value'),
	count_budget_value = document.querySelector('.count_budget_value'),
	hire_employers_item = document.querySelector('.hire_employers_item');

	let money,
		price;
		
		
open.addEventListener('click', () => {
	money = prompt("Ваш бюджет?", "");

	while(isNaN(money) || money == '' || money == null) {
		money = prompt("Ваш бюджет?", "");
	}

	budget_value.textContent = money;

	name_value.textContent = prompt('Название вашего магазина', "").toUpperCase();
	
});
  • Вопрос задан
  • 82 просмотра
Подписаться 1 Простой Комментировать
Решения вопроса 1
0xD34F
@0xD34F Куратор тега JavaScript
Раз:

<div class="budget-value"></div>

Два:

budget_value = document.getElementsByClassName('budget_value')[0]

Три:

budget_value.textContent = money


Понятно, да - перепутали подчёркивание с минусом, в результате элемент оказался undefined, и вы этому undefined пытаетесь назначать свойство.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
Rsa97
@Rsa97
Для правильного вопроса надо знать половину ответа
Скорее всего, на момент вызова скрипта элемент ещё не создан, и поэтому не найден. Вешайте обработчик на document.DOMContentLoaded или window.load и формируйте переменные в нём.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы