Как очистить все параметры в раскрывающемся списке?

чтобы удалить параметры выбранного объекта html, вы можете использовать этот фрагмент кода:

function removeOptions(selectbox)
{
    var i;
    for(i = selectbox.options.length - 1 ; i >= 0 ; i--)
    {
        selectbox.remove(i);
    }
}
//using the function:
removeOptions(document.getElementById("mySelectObject"));

Это будет работать во всех браузерах. =)

Если вы хотите иметь легкий скрипт, а затем перейти на jQuery. В jQuery решение для удаления всех параметров будет выглядеть так:

`$("#droplist").empty();`

наверное, не самое чистое решение, но это определенно проще, чем удаление по одному:

document.getElementById("DropList").innerHTML = "";

Это лучший способ:

function (comboBox) {
    while (comboBox.options.length > 0) {                
        comboBox.remove(0);
    }        
}

Это самый короткий путь:

document.getElementById('mySelect').innerText = null

одна строка, нет Для, нет JQuery, просто.

function removeOptions(obj) {
    while (obj.options.length) {
        obj.remove(0);
    }
}

С PrototypeJS:

$('yourSelect').select('option').invoke('remove');

Если вы используете JQuery и ваш элемент управления select имеет идентификатор "DropList" , вы можете удалить его параметры следующим образом:

$('#DropList option').remove();

на самом деле это работает для меня с любым списком опций, как datalist.

надеюсь, что это помогает.

обратите внимание, что выбор может иметь как
- optgroup &
- коллекция опций
как его дети.

и

Способ #1

var selectElement = document.getElementById('myselectid');
selectElement.innerHTML = '';

Способ #2

var selectElement = document.getElementById('myselectid');
selectElement.textContent = '';

Я тестировал, оба работают на Chrome.
Мне нравится более простой, старомодный метод №1.

попробовать

document.getElementsByTagName("Option").length=0

или, может быть, заглянуть в функцию removeChild ().

или если вы используете jQuery framework.

$("DropList Option").each(function(){$(this).remove();});

использование JQuery-это более красивый, короткий и умный способ сделать это!

$('#selection_box_id').empty();

пойти вспять. Причина-размер уменьшается после каждого удаления.

for (i = (len-1); i > -1; i--) {
    document.getElementById("elementId").remove(i);
}

Я думаю, что это лучшее, соль. это

 $("#myselectid").html(''); 

Это немного современный и чистый JavaScript

document.querySelectorAll('#selectId option').forEach(option => option.remove())

var select = document.getElementById('/*id attribute of your select here*/');
for (var option in select){
    select.remove(option);
}

над кодом ответа нужно небольшое изменение, чтобы удалить список полный, пожалуйста, проверьте этот кусок кода.

var select = document.getElementById("DropList");
var length = select.options.length;
for (i = 0; i < length;) {
  select.options[i] = null;
  length = select.options.length;
}

обновите длину, и она удалит все данные из выпадающего списка. Надеюсь, это кому-то поможет.

простые решения являются лучшими, поэтому вам просто нужно:

var list = document.getElementById('list');
while (list.firstChild) {
    list.removeChild(list.firstChild);
}

<select id="list">
  <option value="0">0</option>
  <option value="1">1</option>
</select>

Это можно использовать для очистки параметров:

function clearDropDown(){
  var select = document.getElementById("DropList"),
      length = select.options.length;
  while(length--){
    select.remove(length);
  }
}

<select id="DropList" >
  <option>option_1</option>
  <option>option_2</option>
  <option>option_3</option>
  <option>option_4</option>
  <option>option_5</option>
</select>
<button onclick="clearDropDown()">clear list</button>

while(document.getElementById("DropList").childNodes.length>0) 
{
    document.getElementById("DropList").removeChild(document.getElementById("DropList").childNodes[0]);
}

Если вы должны поддерживать IE, и у вас есть более 100 элементов в списке выбора, я настоятельно рекомендую вам рассмотреть возможность замены select с помощью такой функции:

function clearOptions(select) {
    var selectParentNode = select.parentNode;
    var newSelect = select.cloneNode(false); // Make a shallow copy
    selectParentNode.replaceChild(newSelect, select);
    return newSelect;
}

параметр select должен быть элементом либо из селектора jquery, либо из документа.getElementBy call. Единственным недостатком этого является то, что вы теряете события, которые вы подключили к select, но вы можете легко подключить их, когда он возвращается обратно из функции. Я работал с выбором, который имел ~3K элементов, и это займет 4 секунды на IE9, чтобы очистить выбор, чтобы я мог обновить его с новым контентом. Почти мгновенно делать это таким образом.

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

var select = document.getElementById("myselect");
for (var i = select.options.length - 1 ; i >= 0 ; i--)
    select.remove(i);

или если вы предпочитаете, вы можете сделать его функция:

function clearOptions(id)
{
    var select = document.getElementById(id);
    for (var i = select.options.length - 1 ; i >= 0 ; i--)
        select.remove(i);
}
clearOptions("myselect");

var select =$('#selectbox').val();

сегодня я столкнулся с той же проблемой, я сделал, как показано ниже при перезагрузке выберите поле. (В простом JS)

        var select = document.getElementById("item");
        select.options.length = 0;
        var opt = document.createElement('option');
        opt.value = 0;
        opt.innerHTML = "Select Item ...";
        opt.selected = "selected";
        select.appendChild(opt);


       for (var key in lands) {
            var opt = document.createElement('option');
            opt.value = lands[key].id;
            opt.innerHTML = lands[key].surveyNo;
            select.appendChild(opt);

        }

$("#yourDDL").получить(0).опции.длина = 0;