Цвет ника

@Mike Sullivan · Регистрация: 13.08.2011

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

суть какая мне нужно создать вот такую форму внизу на скрине и чтобы когда человек выбирал цвет и он сразу в текстовом поле становился таким каким он его выбрал... помогите пожалуйста...

Humanoid · 26.08.2011, 13:28

HTML5
1
2
3
4
5
6
<select>
<option style="background-color: white;">Белый</option>
<option style="background-color: red;">Красный</option>
<option style="background-color: green;">Зелёный</option>
<option style="background-color: blue;">Синий</option>
</select>

@Alex_VP · 26.08.2011, 13:30

Сообщение от Mike Sullivan

суть какая мне нужно создать вот такую форму внизу на скрине и чтобы когда человек выбирал цвет и он сразу в текстовом поле становился таким каким он его выбрал... помогите пожалуйста...

По событию onchange в этом поле меняем стиль оформления background-color на выбранный цвет

HTML5
1
<select onchange="this.style.bgColor='#CCCCCC'">

Но вам этот пример не совсем подходит, так как значение задается в option, поэтому надо вызвать функцию, которая бы обращалась к массиву значений option из select'a. Перепечатывать не буду, приведу цитату из статьи:

Атрибут обработчика события onChange можно использовать в следующих HTML-тегах:

· <select onChange="expr | function()"> . . . <option> . . . </select>
· <textarea onChange="expr | function()"> . . . </textarea>
· <input type=text onChange="expr | function()">

Атрибут onChange задает выражение, которое должно выполняться при потере фокуса ввода элементом HTML-формы и при изменении содержимого этого элемента. Данный атрибут подобен атрибуту onBlur, однако для того чтобы возникло событие Change, содержимое поля должно быть изменено, и поле должно потерять фокус ввода.

Рассмотрим небольшой пример:

JavaScript
1
2
3
4
5
6
7
8
9
<script language ="JavaScript">
<!--
function selChange(seln) {
selNum = seln.beer.selectedIndex;
Isel = seln.beer.options[selNum].text;
alert("Выбрано: "+Isel);
}
//-->
</script>

HTML5
1
2
3
4
5
6
7
8
9
<form>
Выберите марку пива:
<select name="beer" onChange="selChange(this.form)">
<option>Жигулевское
<option>Очаковское
<option>Бочкарев
<option>Красный восток
</select>
</form>

В этом примере имеется единственный объект select с именем beer, содержащий четыре элемента, определенные в тегах <option>. Каждый раз при выборе нового элемента вызывается функция JavaScript с именем selChange(). Для обращения к значениям тегов <option> в программе используется массив свойств options.

Добавлено через 1 минуту

Сообщение от Humanoid

HTML5
1
2
3
4
5
6
<select>
<option style="background-color: white;">Белый</option>
<option style="background-color: red;">Красный</option>
<option style="background-color: green;">Зелёный</option>
<option style="background-color: blue;">Синий</option>
</select>

И правда, а я чего-то перемудрил ))) =)

@Mike Sullivan · 27.08.2011, 02:02 **[ТС]**

Добавил форму и ничего непроизошло... вобщем есть еще обработчик сообщений файлик отдельный может мне в нем что поправить вот код:

PHP
1
2
3
4
5
6
7
8
9
10
<?
session_start();
if(isset($_SESSION['login'])){
    $text = $_POST['text'];
    
    $fp = fopen("log.html", 'a');
    fwrite($fp, "<div class='msgln'>(".date("g:i A").") <b>".$_SESSION['login']."</a></b>: ".stripslashes(htmlspecialchars(iconv("utf-8", "cp1251", $text)))."<br></div>");
    fclose($fp);
}
?>

@Maksimchikfull · 27.08.2011, 18:45

В БД у каждого пользователя должен быть свой цвет. Тоесть который он поставил. Добавь поле mycolor(например).

Ну скажем вот так:
mycolor(VARCHAR)(6) - для HTML цветов.

Потом если не хочеш чтобы был узкий круг цветов и можно было добовлять свои. То можеш сделать таблицу в БД с цветами(colors).

id(INT)(3) - для 999 цветов

color(VARCHAR)(6) - для HTML цветов

Вообщем вот скрипт который выводит в цикле форму с цветами, и меняет цвет пользователю(обработчик):

PHP
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
<?php
if(isset($_POST['submit']))
{
    if(isset($_POST['mycolor']))
    {
        $mycolor = $_POST['mycolor'];
    }
    
    if($mycolor == "")
    {
        unset($mycolor);
        echo "<p>Выберите цвет!</p>";
    }
    
    if(isset($mycolor) and !is_numeric($mycolor))
    {
        unset($mycolor);
        // Ошибка! $mycolor может состоять из цифр!
    }
    
    if(isset($mycolor))
    {
        $result = mysql_query("SELECT `mycolor` FROM `users` WHERE `id` = '$_SESSION[ID]'");
        $row = mysql_fetch_array($result);
        $result = mysql_query("SELECT * FROM `colors` WHERE `color` = '$row[mycolor]'");
        $row = mysql_fetch_array($result);
        if(!isset($row['id']))
        {
            $result = mysql_query("UPDATE `users` SET `mycolor` = '$row[color]' WHERE `id` = '$_SESSION[ID]'");
            if($result == true)
            {
                echo "<p style='color:#33CC33; font-weight:bold;'>Цвет успешно установлен!</p><div style='background-color:#$row[color]; width:100px; height:20px;'></div>";
            }
            else
            {
                echo "<p style='color:#CC3333; font-weight:bold;'>Цвет не установлен!</p>";
            }
        }
        else
        {
                echo "<p style='color:#CC3333; font-weight:bold;'>Такой цвет уже установлен!</p>";
        }
    }
    else
    {
        echo "<p style='color:#CC3333; font-weight:bold;'>ERROR!</p>";
        // Возможно из за: if(isset($mycolor) and !is_numeric($mycolor)). Тоесть отправляли другие значения.
    }
}
 
$result = mysql_query("SELECT `login`,`mycolor` FROM `users` WHERE `id` = '$_SESSION[ID]'");
$row = mysql_fetch_array($result);
$login = $row['login'];
$result = mysql_query("SELECT * FROM `colors` WHERE `color` != '$row[mycolor]'");
$row = mysql_fetch_array($result);
echo "<form name='form1' method='post' action=''>
<p>
<label>
<select name='mycolor' id='mycolor'>
<option value='' selected>Выбор</option>
";
do
{
    echo "<option value='$row[id]' style='background-color:#$row[color];'>$login</option>
";
}
while($row = mysql_fetch_array($result));
echo "</select>
</label>
<label>
<input type='submit' name='submit' id='submit' value='Изменить'>
</label>
</p>
</form>
";
?>

Думаю всем понятен код.

Добавлено через 10 минут
Щас чуть подругому напишу...

Добавлено через 8 минут
Чуть изменил, и добавил возможность добавление своих цветов:

PHP
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
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
<?php
// Обработчик
if(isset($_POST['submit']))
{
    if(isset($_POST['mycolor']))
    {
        $mycolor = $_POST['mycolor'];
    }
    
    if($mycolor == "")
    {
        unset($mycolor);
        echo "<p>Выберите цвет!</p>";
    }
    
    if(isset($mycolor) and !is_numeric($mycolor))
    {
        unset($mycolor);
        // Ошибка! $mycolor может состоять из цифр!
    }
    
    if(isset($mycolor))
    {
        $result = mysql_query("SELECT `mycolor` FROM `users` WHERE `id` = '$_SESSION[ID]'");
        $row = mysql_fetch_array($result);
        $result = mysql_query("SELECT * FROM `colors` WHERE `color` = '$row[mycolor]'");
        $row = mysql_fetch_array($result);
        if(!isset($row['id']))
        {
            $result = mysql_query("UPDATE `users` SET `mycolor` = '$row[color]' WHERE `id` = '$_SESSION[ID]'");
            if($result == true)
            {
                echo "<p style='color:#33CC33; font-weight:bold;'>Цвет успешно установлен!</p><div style='background-color:#$row[color]; width:100px; height:20px;'></div>";
            }
            else
            {
                echo "<p style='color:#CC3333; font-weight:bold;'>Цвет не установлен!</p>";
            }
        }
        else
        {
                echo "<p style='color:#CC3333; font-weight:bold;'>Такой цвет уже установлен!</p>";
        }
    }
    else
    {
        echo "<p style='color:#CC3333; font-weight:bold;'>ERROR!</p>";
        // Возможно из за: if(isset($mycolor) and !is_numeric($mycolor)). Тоесть отправляли другие значения.
    }
}
 
// Вывод доступных цветов из БД
$result = mysql_query("SELECT `login`,`mycolor` FROM `users` WHERE `id` = '$_SESSION[ID]'");
$row = mysql_fetch_array($result);
$login = $row['login'];
$result = mysql_query("SELECT * FROM `colors` WHERE `color` != '$row[mycolor]'");
$row = mysql_fetch_array($result);
echo "<form name='form1' method='post' action=''>
<p>
<label>
<select name='mycolor' id='mycolor'>
<option value='' selected>Выбор</option>
";
do
{
    echo "<option value='$row[id]' style='background-color:#$row[color];'>$login</option>
";
}
while($row = mysql_fetch_array($result));
echo "</select>
</label>
<label>
<input type='submit' name='submit' id='submit' value='Изменить'>
</label>
</p>
</form>
";
 
// Вывод логина(ника) покрашеным в цвет принадлежащей ему записи в БД
$result = mysql_query("SELECT `login`,`mycolor` FROM `users` WHERE `id` = '$_SESSION[ID]'");
$row = mysql_fetch_array($result);
echo "<p>Мой ник: <span style='color:#$row[mycolor]; font-weight:bold;'>$row[login]</span></p>";
 
// Вставка нового цвета
 
// Обработчик
if(isset($_POST['submit']))
{
    if(isset($_POST['newcolor']))
    {
        $color = $_POST['newcolor'];
    }
    
    if($color == "")
    {
        unset($color);
        echo "<p>Вы не ввели цвет!</p>";
    }
    
    if(isset($color) and !preg_match("/^[A-Za-z0-9]/i", $color))
    {
        unset($color);
        echo "<p>Ошибка! $color может состоять из латинских букв и цифр!</p>";
    }
    else
    {
        $color = strtoupper($color);
    }
    
    if(isset($color))
    {
        $result = mysql_query("SELECT `color` FROM `colors` WHERE `color` = '$color'");
        $row = mysql_fetch_array($result);
        if(!isset($row['color']))
        {
            $result = mysql_query("INSERT INTO `colors`(color) VALUES ($color)");
            if($result == true)
            {
                echo "<p style='color:#33CC33; font-weight:bold;'>Цвет успешно добавлен!</p><div style='background-color:#$row[color]; width:100px; height:20px;'></div>";
            }
            else
            {
                echo "<p style='color:#CC3333; font-weight:bold;'>Цвет не добавлен!</p>";
            }
        }
        else
        {
                echo "<p style='color:#CC3333; font-weight:bold;'>Такой цвет уже существует в БД!</p>";
        }
    }
}
 
// Форма
echo "<form name='form1' method='post' action=''>
<p>
<label>HTML цвет:
<input name='newcolor' type='text' id='newcolor' size='6' maxlength='6'>
</label>
<label>
<input type='submit' name='submit' id='submit' value='Добавить'>
</label>
</p>
<p>Пример:<br>
White(Белый)
- FFFFFF<br>
Black(Чорный)
- 000000<br>
Red(Красный) - FF0000<br>
Yellow(Желтый)
- FFFF00<br>
Green(Зеленый)
- 00FF00<br>
Blue(Синий)
- 0000FF<br>
LightBlue(Ярко-Синий или Голубой)
- CCCCFF<br>
...
</p>
</form>
";
?>

Добавлено через 1 минуту
Будте внимательны! Я скрипт не проверял!

Новые блоги и статьи Все статьи Все блоги /
Изучаю kubernetes lagorue 13.01.2026 А пригодятся-ли мне знания kubernetes в России?	Сукцессия микоризы: основная теория в виде двух уравнений. anaschu 11.01.2026 https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/	WordPad для Windows 11 Jel 10.01.2026 WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .	Classic Notepad for Windows 11 Jel 10.01.2026 Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .
Почему дизайн решает? Neotwalker 09.01.2026 В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .	Модель микоризы: классовый агентный подход 3 anaschu 06.01.2026 aa0a7f55b50dd51c5ec569d2d10c54f6/ O1rJuneU_ls https:/ / vkvideo. ru/ video-115721503_456239114	Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ФедосеевПавел 06.01.2026 Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ВВЕДЕНИЕ Введу сокращения: аналоговый ПИД — ПИД регулятор с управляющим выходом в виде числа в диапазоне от 0% до. . .	Модель микоризы: классовый агентный подход 2 anaschu 06.01.2026 репозиторий https:/ / github. com/ shumilovas/ fungi ветка по-частям. коммит Create переделка под биомассу. txt вход sc, но sm считается внутри мицелия. кстати, обьем тоже должен там считаться. . . .

@Mike Sullivan 0 / 0 / 0 Регистрация: 13.08.2011 Сообщений: 42

	Цвет ника 26.08.2011, 12:56. Показов 2336. Ответов 4 Метки нет (Все метки) суть какая мне нужно создать вот такую форму внизу на скрине и чтобы когда человек выбирал цвет и он сразу в текстовом поле становился таким каким он его выбрал... помогите пожалуйста... Изображения 0