Выбор начертания текста

@Egorik008 · Регистрация: 20.09.2022

Студворк — интернет-сервис помощи студентам

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

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<html>
<head>
<style>
h1 {color:black;text-align:left;}
body {background-color:PaleGreen; font-weight:bold;}
input {font-weight:bold;}
</style>
 
<script type="text/JavaScript">
function GO()
{
var p10=document.getElementById('d3');
var p9=document.getElementById('d2');
var p8=document.getElementById('d1');
var p1=document.getElementById('k1');
var p3=document.getElementById('k2');
var p4=document.getElementById('k3');
var p5=document.getElementById('c1');
var p6=document.getElementById('c2');
var p7=document.getElementById('c3');
var p2=document.getElementById('tx');
var r2=p2.value;
st1="<body><h2>"
st3="</h2><img src="
st5=" /></body>"
 
 
if (p8.selected)
{ st2=p8.text ; st4="'1.jpg'" }
if (p9.selected)
{ st2=p9.text; st4="'2.jpg'"}
if (p10.selected)
{ st2=p10.text; st4="'3.jpg'"}
        if (k1.checked) v='#ffffff'
        if (k2.checked) v='#FFD700'
        if (k3.checked) v='#008B8B'
        if (c1.checked) d='italic'
        if (c2.checked) d='bold'
        if (c3.checked) d='underline'
 
var win=window.open("","","width=1024,height=900");
win.document.open();
 
 
 
str=st1+st2+st3+st4+st5
win.document.write(str);
var str6="<h2>"+r2+"</h2>";
win.document.write(str6);
var str="<head><style> body {background-color:"+v+";}</style></head>"
win.document.write(str);
var str="<head><style> h1 {font-style:"+dt+";} </style></head>"
win.document.write(str);
var str = "<h1>"+e+"</h1><hr><P>";
win.document.write(str);
win.document.close();
}
</script>
</head>
<body>
<form>
<h1>Страничка по заказу</h1>
Художник:
<select>
<option id='d1'>Айвазовский</option>  
<option id='d2'>Репин</option> 
<option id='d3'>Тропинин</option> 
</select><p>
 
 
Подпись: <input type="text" value="" id="tx" name="tx" size="50"><p>
<table>
  <tr>
<td>Картинка для фона</td><td>Декорирование текста</td> <tr>
<td><input type='radio' id='k1' name='v' checked />&nbsp&nbsp Фон №1</td><td><input type="checkbox" id="c1" name="d"> курсив/нет</td> <tr>
<td><input type='radio' id='k2' name='v' checked />&nbsp&nbsp Фон №2</td> <td><input type="checkbox" id="c2" name="d"> подчеркивание/нет</td><tr>
<td><input type='radio' id='k3' name='v' checked />&nbsp&nbsp Фон №3</td> <td><input type="checkbox" id="c3" name="d"> жирный/нет</td><tr>
<td><input type="reset" value="Сброс"></td><td><input type="button" value="Показать" onclick="GO()"></td><tr>
</table>
</form>
</body>
</html>

@klyapa · 04.03.2023, 11:25

HTML5
1
2
3
4
5
6
7
8
9
10
11
<fieldset>
    <legend>Страничка по заказу</legend>
    <select id="sel">
        <option disabled selected>Выбрать</option>
        <option value="http://www.koob.ru/foto/author/16845.jpg">Репин</option>
        <option value="https://i.pinimg.com/236x/8c/6e/38/8c6e3896ca0ae6a810ffd53abd1fa6bb.jpg">Тропинин</option>
        <option value="https://i1.wp.com/shopsell-out.ru/wp-content/uploads/2019/10/ivan-ajvazovskij.jpg">Айвазовский</option>
    </select>
    <input id="txt" placeholder="Описание" />
    <button id="btn">Открыть</button>
</fieldset>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
const [sel, txt, btn] = ['sel', 'txt', 'btn'].map(id => document.getElementById(id));
 
const content = (url, cap) => {
    return `<style>
    figure {
        margin: auto;
        display: inline-block;
        padding: 5px;
        background: #ebeaea;
        border: 2px solid #dcdcdc;
        border-radius: 4px;
        text-align: center;
    }
    </style>
    <figure>
        <img src="${url}" />
        <figcaption>${cap}</figcaption>
    </figure>`;
};
 
btn.addEventListener('click', () => window.open().document.body.innerHTML = content(sel.value, txt.value));

Новые блоги и статьи Все статьи Все блоги /
Фото всей Земли с борта корабля Orion миссии Artemis II kumehtar 04.04.2026 Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .	Вывод диалогового окна перед закрытием, если документ не проведён Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .	Программный контроль заполнения реквизита табличной части документа Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать контроль заполнения реквизита "ПричинаСписания". . .	wmic не является внутренней или внешней командой Maks 02.04.2026 Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/
Программная установка даты и запрет ее изменения Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: при создании документов установить период списания автоматически. . .	Вывод данных в справочнике через динамический список Maks 01.04.2026 Реализация из решения ниже выполнена на примере нетипового справочника "Спецтехника" разработанного в конфигурации КА2. Задача: вывести данные из ТЧ нетипового документа. . .	Программное заполнения текстового поля в реквизите формы документа Maks 01.04.2026 Алгоритм из решения ниже реализован на нетиповом документе "ВыдачаОборудованияНаСпецтехнику" разработанного в конфигурации КА2, в дополнении к предыдущему решению. На форме документа создается. . .	К слову об оптимизации kumehtar 01.04.2026 Вспоминаю начало 2000-х, университет, когда я писал на Delphi. Тогда среди программистов на форумах активно обсуждали аккуратную работу с памятью: нужно было следить за переменными, вовремя. . .