Как показать отключить опцию выбора HTML по умолчанию?
Я новичок в HTML и PHP и хочу добиться выпадающего меню из таблицы mysql и жестко закодирован тоже. У меня есть несколько выбрать на моей странице, один из них
<select name="tagging">
<option value="">Choose Tagging</option>
<option value="Option A">Option A</option>
<option value="Option B">Option B</option>
<option value="Option C">Option C</option>
</select>
проблема в том, что теперь пользователь может также выбрать "выбрать тегирование" в качестве своего тегирования, но я хочу только предоставить ему выбор из доступных трех. Я использовал отключить как
<select name="tagging">
<option value="" disabled="disabled">Choose Tagging</option>
<option value="Option A">Option A</option>
<option value="Option B">Option B</option>
<option value="Option C">Option C</option>
</select>
но теперь "вариант A"стал по умолчанию. Поэтому я хочу установить "выбрать тегирование" по умолчанию, а также отключить его от выбор. Это способ сделать это. То же самое нужно сделать с другим выбором, который будет извлекать данные из Mysql. Любое предложение будет заметно.
11 ответов:
Я знаю, что вы спрашиваете, как отключить эту опцию, но я считаю, что визуальный результат конечных пользователей одинаков с этим решением, хотя он, вероятно, немного менее требователен к ресурсам.
использовать optgroup тег, вот так :
<select name="tagging"> <optgroup label="Choose Tagging"> <option value="Option A">Option A</option> <option value="Option B">Option B</option> <option value="Option C">Option C</option> </optgroup> </select>
Электрон + Реагируют Пусть ваши два первых варианта будут такими
<option hidden="true>Choose Tagging</option> <option disabled="disabled" default="true">Choose Tagging</option>сначала отображается при закрытии Во-вторых, чтобы отобразить первый, когда список открывается
использовать
hidden.<select> <option hidden>Choose</option> <option>Item 1</option> <option>Item 2</option> </select>это не отменяет его, но вы можете скрыть его в настройках, пока он отображается по умолчанию.
Если вы используете jQuery для заполнения элемента select, вы можете использовать это:
html
<select id="tagging"></select>js
array_of_options = ['Choose Tagging', 'Option A', 'Option B', 'Option C'] $.each(array_of_options, function(i, item) { if(i==0) { sel_op = 'selected'; dis_op = 'disabled'; } else { sel_op = ''; dis_op = ''; } $('<option ' + sel_op + ' ' + dis_op + '/>').val(item).html(item).appendTo('#tagging'); })это позволит пользователю увидеть первый вариант в качестве отключенного заголовка ("выбрать тегирование") и выбрать все остальные параметры.
другое решение SELECT tag для тех, кто хочет сохранить первый вариант пустым.
<label>Unreal :</label> <select name="unreal"> <option style="display:none"></option> <option>Money</option> <option>Country</option> <option>God</option> </select>
вы можете установить, какой параметр выбран по умолчанию следующим образом:
<option value="" selected>Choose Tagging</option>Я бы предложил использовать javascript и JQuery для наблюдения за событием щелчка и отключить первый вариант после выбора другого: Во-первых, дайте элементу идентификатор следующим образом:
<select id="option_select" name="tagging">и опция идентификатор:
<option value="" id="initial">Choose Tagging</option>затем:
<script type="text/javascript"> $('option_select').observe(click, handleClickFunction);затем вы просто создаете функцию:
function handleClickFunction () { if ($('option_select').value !== "option_select") { $('initial').disabled=true; } }
мы можем отключить эту технику.
<select class="form-control" name="option_select"> <option selected="true" disabled="disabled">Select option </option> <option value="Option A">Option A</option> <option value="Option B">Option B</option> <option value="Option C">Option C</option> </select>
У меня есть выпадающее меню, которое отображает --выберите Параметры-- по умолчанию. Однако, как только опция была выбрана и нажата кнопка мыши, выбранная опция будет продолжать оставаться вместо сброса к значению по умолчанию ---выберите параметры--- которые мне нужны после события нажатия кнопки. Ниже приведен пример кода для справки :-
select [(ngModel)]="selectedValue"> <option value="selectOptions" disabled="disabled">---Select Options---</option> <option *ngFor="let somevalue of somevalues" [value]="somevalue">{{somevalue}}</option> </select> export class MyComponent { ngOnInit() { somevalues= ['abc', 'def','ghi']; selectedValue= "selectOptions"; } someFunction() { // process selected option var selection = selectedValue; : : //reset selectedValue to "--Select Options--" selectedValue = "selectOptions"; } }

Comments