Задать вопрос
NitroMen
@NitroMen
Beginner in Java
javascript

Как получить данные из поля от пользователя и вставить картину по его значению?

Написал простенький код, для того чтобы пользователь мог вводить имя картинки в поле и потом выбирал разрешение картинки, и после нажатия кнопки все вышло. Подскажите в чем промах? Код предоставил ниже 

<!DOCTYPE html>
<html>
	<head>
		<title>HW4</title>
        <script>
			function myFunction() {
            	let source = document.getElementById("numb").value;
                var image = document.getElementsByClassName("image1");
                image.src = source;
                var valuey = valuey.valuey.options[0];
                var valuex = valuex.valuex.options[0];
                switch(valuey) {
                	case 100:
                    	image.style.width = '100px';
                    case 200:
                    	image.style.width = '200px';
                    case 300:
                    	image.style.width = '300px';
                 }
                 switch(valuex) {
                	case 100:
                    	image.style.height = '100px';
                    case 200:
                    	image.style.height=  '200px';
                    case 300:
                    	image.style.height = '300px';
                 }
            }
		</script>
	</head>
	<body>
		<input id="numb">
        <img id="image1">
        <form name="valuey">
        <select name="valuey" id="valuey">
        	<option valuey="100">100</option>
        	<option valuey="200">200</option>
        	<option valuey="300">300</option>
        </select>
        </form>
        <form name="valuex">
        <select name="valuex" id="valuex">
        	<option valuex="100">100</option>
        	<option valuex="200">200</option>
        	<option valuex="300">300</option>
        </select>
        </form>
        <button type="button" onclick="myFunction()">Submit</button>
        
       
	</body>
</html>
  • Вопрос задан
  • 120 просмотров
Комментировать
Подписаться 1 Простой Комментировать
Решения вопроса 2
wapster92
@wapster92 Куратор тега JavaScript
У тебя js код обращается к элементам которых еще нет, хочешь меньше делать таких глупых ошибок - всегда вставляй js перед </body>

var valuey = valuey.valuey.options[0];
var valuex = valuex.valuex.options[0];
Здесь неверное обращение valuex.options[0];
Но опять же подход не верен. Тебе нужно смотреть не на значение опции, а на значение селекта valuex.value
И лучше обращаться к dom не по значению имени переменной из id, а через методы по работе с dom
Ответ написан
1 комментарий
1 комментарий
AndrewMarty
@AndrewMarty
Frontend
Вот быстренько накидал, может вам поможет
Ответ написан
3 комментария
3 комментария
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Fullstack разработчик JavaScript, php
Дорстрой-36 • Воронеж
от 100 000 до 200 000 ₽
JavaScript FullStack developer
Wanted. • Санкт-Петербург
До 220 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Смонтировать видео
23 нояб. 2024, в 01:31
1000 руб./за проект
Настроить сайт
23 нояб. 2024, в 00:16
2000 руб./за проект
Разобрать текущий ETL-процесс
22 нояб. 2024, в 23:55
3000 руб./за проект
Ещё заказы