СКРИПТЫ
ТЕГИ:
php (284)
js (166)
html (138)
css (116)
html tags (61)
jquery (40)
edit text (37)
php array (30)
form html (29)
fonts (27)
ruweb.net (23)
foto (22)
online (20)
atom (20)
forum (19)
svg (18)
Показать еще :
board (17)
hosting (17)
php file (16)
html book (16)
js method (16)
input (15)
color (15)
php date (15)
link (15)
js events (14)
osclass (13)
table (13)
htaccess (13)
path (12)
js delete (12)
dw block (12)
select (12)
download (11)
icon (11)
jsphp (11)
php time (11)
img (11)
keyboard (11)
notepad (11)
php img (11)
form (11)
url (10)
mouse (10)
yandex (9)
info (9)
js time (9)
task (7)
dosite (7)
php url (7)
hover (7)
cookie (7)
comment (7)
js url (6)
mysql (6)
list (6)
year (6)
click (6)
iframe (6)
ftp (5)
search (5)
chart (5)
browser (5)
php get (5)
mb (5)
js id (5)
value (5)
adminka (5)
heading (5)
mounth (4)
bbcode (4)
symbols (4)
vk (4)
day (4)
console (4)
js form (4)
reg.ru (4)
submit (4)
week (4)
js img (3)
line (3)
captcha (3)
ucoz (3)
https (3)
js post (3)
ssl (3)
padding (3)
vs code (3)
scandir (3)
pages (3)
рся (2)
second (2)
money (2)
youtube (2)
video (2)
js vars (2)
seo (2)
typeof (2)
sitemap (2)
title (2)
tag hr (2)
cursor (2)
counter (2)
arrows (2)
base64 (2)
qr kod (2)
details (2)
height (2)
куб (1)
books (1)
scroll (1)
domen (1)
numbers (1)
google (1)
header (1)
windows (1)
smile (1)
speed (1)
archive (1)

Как в select поставить placeholder

placeholder select или визуальная подсказка в поле select, как сделать примеры, скачать

Placeholder для select

  1. Placeholder для select - вариант 1.
  2. Placeholder для select - вариант 2.
  3. Скачать можно здесь

  1. Placeholder для select - вариант 1.

    Нам нужна простая реализация в коде Placeholder для select. Никаких диаметрально разных вариантов для Placeholder в select - не существует. Это всего лишь разновидность на тему, вариант №1:

    Оборачиваем наш select в div:

    <div class="select"></div>

    В первом option прописываем атрибуты : "selected disabled hidden"

    <option selected disabled hidden>Выберите</option>

    И получаем результат:

    Пример Placeholder для select - вариант 1.

    Как видим, после выбора одного из option откатиться в нулевую позицию не получится. Для этого из первой строки удаляем "selected disabled hidden"

    Пример Placeholder для select - вариант 1.1


  2. Placeholder для select - вариант 2.

    Следующий вариант еще проще чем первый. А по результату аналогичен.

    Опять оборачиваем наш select в div:

    <div class="select"></div>

    В первом option добавляем "style="display:none"".

    value="" можно не ставить, поскольку после выбора "option" первый вариант не будет доступен.

    <option value="" style="display:none"</option>

    И получаем результат:

    Пример Placeholder для select - вариант 2.

    Как видим - опять, после выбора одного из пунктов, откатится в нулевую точку не получится.

    Давайте уберем style="display:none" :

    Пример Placeholder для select - вариант 2.1.

    В таком варианте, выбрать нулевую ячейку "option" возможно.

Пользуйтесь на здоровье! Не забудьте сказать спасибо
Название скрипта :placeholder select
Ссылка на скачивание : Все скрипты на одной странице
Теги :
select placeholder
html select placeholder
select option placeholder
css select placeholder
select placeholder html
placeholder html select
Комментариев : 2 COMMENTS+   BBcode
аватар
🞨
Загрузить свой аватар
(max ширина, высота = 200px)

Подписаться + =

скопировать ссылку пожаловаться
11/03/2021 12:44 Serp
<details> <summary> c этими тож можно такие манипуляции делать ?
ответить
скопировать ссылку пожаловаться
11/03/2021 02:20 Марат Serp
Если о вложенности, то да.
Если вы о "selected disabled hidden", то...
Я эти теги никогда не использовал, поэтому, ничего сказать не могу...
ответить

Счетчик в график :

Построение гравиков
Основа для графика : счетчик посещаемости.
Последние комментарии :
вывы :
05.06.2022 12:32
сейчас яндекс добавил индексацию js в…
подробнее.
Марат :
02.06.2022 20:14
Михаил :
02.06.2022 20:10
Ну вот только для этого может быть ;) А так, нет смысла…
подробнее.
Марат :
02.06.2022 15:59
Чтобы вы зашли на данную страницу и нажали на…
подробнее.
Михаил :
02.06.2022 14:33
Ну вот только для этого может быть :) А так, нет смысла…
подробнее.
Алексей :
26.05.2022 14:19
👍👍👍
подробнее.
ruweb
Страница загружена за : 0.018484 секунд. Подробнее