Как показать отключить опцию выбора 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. Любое предложение будет заметно.

568   11  

11 ответов:

использовать

<option selected="true" disabled="disabled">Choose Tagging</option>    

Я знаю, что вы спрашиваете, как отключить эту опцию, но я считаю, что визуальный результат конечных пользователей одинаков с этим решением, хотя он, вероятно, немного менее требователен к ресурсам.

использовать 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>

на HTML5, чтобы выбрать опцию:

<option selected disabled>Choose Tagging</option>
 selected disabled="true"

использовать это. Он будет работать в новых браузерах

Электрон + Реагируют Пусть ваши два первых варианта будут такими

<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>

это не отменяет его, но вы можете скрыть его в настройках, пока он отображается по умолчанию.

jsfiddle

Если вы используете 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');
  })

это позволит пользователю увидеть первый вариант в качестве отключенного заголовка ("выбрать тегирование") и выбрать все остальные параметры.

enter image description here

другое решение 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

    Ничего не найдено.