Получите все значения из раскрывающегося списка, кроме выбранного в JavaScript.

-4

У меня есть выпадающее меню с некоторыми случайными значениями. Когда я выбираю триггеры события onchange, и я хочу добавить в него новое раскрывающееся меню, но новый должен иметь все значения, кроме выбранного в первом раскрывающемся списке. Теперь, когда я изменяю значение второго, мне нужен третий, который имеет только не выбранные значения из двух предыдущих падений. Каков самый простой способ сделать это в javaScript?

Теперь у меня есть механизм добавления новых выпадающих списков, но на данный момент я заполняю его некоторыми фиктивными данными. Мне нужно реализовать функцию, которую я могу назвать вместо dateGenerate()

Я должен решить это без использования jQuery :(

Это HTML:

Test:<br>
<select id="ddlTest" onchange="addNewTestDrop('newTest');">
<option value=""></option>
<option value="Raven">Raven</option>
<option value="PPA">PPA</option>
<option value="PPA+">PPA+</option>
<option value="Basic Knowledge">Basic Knowledge</option>
<option value="PCT">PCT</option>
</select>
<div id="newTest">
</div>

И это javaScript у меня есть:

    function dateGenerate() {
var date = new Date(), dateArray = new Array(), i;
curYear = date.getFullYear();
for(i = 0; i<5; i++) {
dateArray[i] = curYear+i;
}
return dateArray;
}

function addNewTestDrop(divname) {
var newDiv=document.createElement('div');
var html = '<select>', dates = dateGenerate(), i;
for(i = 0; i < dates.length; i++) {
html += "<option value='"+dates[i]+"'>"+dates[i]+"</option>";
}
html += '</select>';
newDiv.innerHTML= html;
document.getElementById(divname).appendChild(newDiv);
}

спросил(а) 2016-08-10T13:31:00+03:00 4 года, 1 месяц назад
0
57

Вы можете изменить этот код по мере необходимости.


$(document).ready(function() {

var selectWrapper = $('#select-boxes');

$(document).on('change', '.dynamic-select', function() {
var element = $(this);
var optionsLength = (element.find('option').length) - 1; // because we have an empty option

if(optionsLength === 1) {
return true;
}

var newSelect = $(this).clone();
newSelect.find("option[value='" + element.val() + "']").remove();
newSelect.appendTo(selectWrapper)
});

});

.dynamic-select{
display: block;
margin: 10px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div id="select-boxes">
<select class="dynamic-select">
<option value=""></option>
<option value="Raven">Raven</option>
<option value="PPA">PPA</option>
<option value="PPA+">PPA+</option>
<option value="Basic Knowledge">Basic Knowledge</option>
<option value="PCT">PCT</option>
</select>
</div>

ответил(а) 2016-08-10T13:51:00+03:00 4 года, 1 месяц назад
57

Получите все параметры, кроме тех, которые имеют то же значение, что и выбор (как он выбран), клонируют их и добавляют к новому элементу

document.getElementById('ddlTest').addEventListener('change', function() {
var newSelect = document.createElement('select');

var options = [].slice.call(this.querySelectorAll('option')).forEach(function(elem) {
if (this.value !== elem.value) newSelect.appendChild(elem.cloneNode(true))
}.bind(this));

document.getElementById('newTest').appendChild(newSelect);
}, false);

FIDDLE

ответил(а) 2016-08-10T13:34:00+03:00 4 года, 1 месяц назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема