Задать вопрос
@Porebro
javascript

Как по клику на кнопку, изменить цвет фона страницы?

У нас есть поле в виде input. Есть рядом кнопка button. При вводе в поле название цвета ( например red или #001) и нажатии по кнопке, фон body будет меняться.
Я новичок в этом деле , поэтому прошу помощи.
Вот исходный код:

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8" />
	<script>
	function changecollor()
	{
	 var color=document.getElementById('tag');
		var test_1=document.body.style.backgroundColor;

		var znachenie=document.getElementById('result');
		color.style.background=znachenie.value;
	}
	
	</script>
</head>
<body id="tag">
<input id="result"/>
<button onclick="changecollor();">Изменить</button>
</body>
</html>


В общем написал корявенький код, есть ли смысл его подредактировать?

И как можно после ввода значения в input сделат так чтобы инпут очищался , а фокус оставался в поле ?
znachenie.value='';
		znachenie.focus();

НЕ помогает.
  • Вопрос задан
  • 8019 просмотров
Комментировать
Подписаться 1 Оценить Комментировать
Решения вопроса 1
In4in
@In4in
°•× JavaScript Developer ^_^ ו°
НЕ помогает.

А вот и помогает

В общем написал корявенький код, есть ли смысл его подредактировать?

1. А почему не обращаться к document.body, вместо того, чтобы засорять страницу лишними идентификаторами?
2. input всем сердцем хочет лежать внутри формы, как и кнопка, которую гораздо круче было бы сделать сабмитом, да и вообще: 
<!DOCTYPE html>
<html>
  <head>
    <script type="text/javascript">
      function changecolor(e)
      {
       e.preventDefault();

       var input = this.elements[0];
       document.body.style.backgroundColor = input.value;
       input.value = '';
       input.focus();
    }
    </script>
   </head>
   <body>
     <form onsubmit="changecolor();">
        <input placeholder="white" type="text">
        <input type="submit" value="Изменить">
     </form>
  </body>
</html>

Теперь цвет можно установить и нажатием Enter.
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Fullstack разработчик JavaScript, php
Дорстрой-36 • Воронеж
от 100 000 до 200 000 ₽
JavaScript FullStack developer
Wanted. • Санкт-Петербург
До 220 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Разработать скрипт-парсер для новостного сайта
22 нояб. 2024, в 18:50
30000 руб./за проект
Требуется разработчик Telegram-бота для анализа звонков продаж
22 нояб. 2024, в 18:45
10000 руб./за проект
Почистить скан от мусора
22 нояб. 2024, в 18:39
7600 руб./за проект
Ещё заказы