По нажатию на кнопку Показать приложение должно открыть новое окно и показать в нем заказанные картинки с короткими подписями - JavaScript, Ajax

Zerroz · 26.04.2017, 23:56

По нажатию на кнопку Показать приложение должно открыть новое окно и показать в нем
заказанные картинки с короткими подписями. Новое окно должно создаваться “на лету” с
использованием информации, которую ввел в форму пользователь.

Код HTML:

<html>
<head>
	<style>
	 h1 {color:black;text-align:center;}
	 body {background-color:PaleGreen; font-weight:bold;}
	 input {font-weight:bold;}
	</style>

	  <script>
		function reloadPage()
		{
		 window.location.reload()
		}

		function hello()
		{
		 var p=document.getElementById('t');
		 var o=document.getElementById('tx');

		   var ii1=document.getElementById('i1');
		   var ii2=document.getElementById('i2');
		   var ii3=document.getElementById('i3');

			var o1=document.getElementById('l1');
			var o2=document.getElementById('l2');
			var o3=document.getElementById('l3');

		   		var cc1=document.getElementById('c1');
		   		var cc2=document.getElementById('c2');
		  		var cc3=document.getElementById('c3');

		 r=p.value;
		 e=o.value;

		   st1="<body><h2>"
		   st3="</h2><img src="
		   st5=" /></body>"

		   if (ii1.selected)
		   { st2=ii1.text; st4="'#004DFF'" }
		   if (ii2.selected)
		   { st2=ii2.text; st4="'#ffffff'" }
		   if (ii3.selected)
		   { st2=ii3.text; st4="'#000000'" }

			if (o1.checked) vt='#ffffff'
			if (o2.checked) vt='#000000'
			if (o3.checked) vt='#004DFF'

				if (cc1.checked) bc='#ffffff'
				if (cc2.checked) bc='#000000'
				if (cc3.checked) bc='#004DFF'

		 var win=window.open("","","width=800,height=480");
		 win.document.open();

		  var str = "<h1>"+r+"</h1><hr><P>";
		  win.document.write(str);

		   str=st1+st2+st3+st4+st5
		   win.document.write(str);

			var str="<head><style> h1 {color:"+vt+";} h2 {color:"+vt+";}</style></head>"
			win.document.write(str);

		  var str = "<h1>"+e+"</h1><hr><P>";
		  win.document.write(str);

				var atr="<head><style> body {background-color:"+bc+";}</style></head>"
				win.document.write(atr);

		  str ='<input type="button" value="Закрыть"'
		  +'onClick="window.close();">';
		  win.document.write(str);

		 win.document.close();
		}
	</script>
</head>

<body>
	<h1>Страничка по заказу</h1>
	<hr>
	<form>
	
	<table>
	 <tr>
		<td width="115">Загаловок</td>	
		<td><input type=text value="" name="t" id='t' size="18"></td>
	 </tr>
	
	 <tr>
<td><p></td> 		
	<td align='center';>
	 <input type='checkbox' id='i1' name='ccb' checked />
<td><p>Собака</td> 	
	</td>
<tr>
<td><p>Картинка</td> 	
	<td align='center';>
	<input type='checkbox' id='i2' name='ccb'  />
<td><p>Одинокий цветок</td> 	
	</td>
</tr>
<tr>
<td><p></td> 	
	<td align='center';>
	<input type='checkbox' id='i3' name='ccb'  />
<td><p>Букет</td> 	
	</td>
	 </tr>
	
	 <tr>
		<td><p>Подпись</td>		
		<td><input type="text"id="tx" name="tx" value="" size="18"></td>
	 </tr>
	</table>
<p>
<p>
	

	<table>
	 <tr>
		<td>Цвет фона</td>
		<td width="155";></td>
		<td>Цвет текста</td>
	 </tr>

	 <tr>
		<td align='center';>
		<select>
		 <option id='c1'>Cиний</option>
		 <option id='c2'>Белый</option>
		 <option id='c3'>Черный</option>
		</select>
		</td>

		<td bgcolor="#ffffff">
		</td>

		<td align='center';>
		 <input type='radio' id='l1' name='v' />
		</td>

	 </tr>

	 <tr>
<td><p></td> 

		<td bgcolor="#000000">
		</td>

		<td align='center';>
		 <input type='radio' id='l2' name='v' />
		</td
	 </tr>

	 <tr>
<td><p></td> 

		<td bgcolor="#004DFF">
		</td>

		<td align='center';>
		 <input type='radio' id='l3' name='v' checked />
		</td>
	 </tr>	
	</table>


<p>		<input type=button value="Показать" OnClick="hello()">
		<input type="button" value="Сброс" onclick="reloadPage()" />
<hr>
</form>
</body>
</html>

B41dYgJ9I-U.jpg
Признаю косяков в коде много, но мне бы хотя бы реализовать возможность где надпись "Картинка", управляя checkbox'ani добавлять картинки и где надпись "Цвет фона" с помощь списка менять цвет фона.

Опции темы	Поиск в этой теме
Версия для печати Отправить по электронной почте	Поиск в этой теме: Расширенный поиск

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Java Swing открыть новое окно и при нажатии на кнопку вернуться к предыдущему	Titan_of_war	Общие вопросы по Java, Java SE, Kotlin	1	25.10.2016 16:00
Спрятать или показать кнопку окна в таскБаре	Altera	Win Api	3	09.12.2009 09:03
Показать ADOConnection1.Connectionstring по нажатию на кнопку	hitch1	БД в Delphi	9	07.12.2009 17:44
Показать окно по нажатию кнопки	L.A.M.E.R.	Общие вопросы Delphi	6	20.07.2009 22:22
Как показать одну форму из другой в С++ по нажатию кнопки	anton.metal	Общие вопросы .NET	1	21.11.2008 19:38