Удалить значения из списка выбора в зависимости от условия
У меня есть следующая страница
<select name="val" size="1" >
<option value="A">Apple</option>
<option value="C">Cars</option>
<option value="H">Honda</option>
<option value="F">Fiat</option>
<option value="I">Indigo</option>
</select>
Я хотел бы удалить определенные значения из моего select, если определенные условия верны.
например
if(frm.product.value=="F"){
// remove Apple and Cars from the select list
}
Как это сделать, используя javascript
Ответы
Ответ 1
Укажите идентификатор для выбранного объекта, например, так:
<select id="mySelect" name="val" size="1" >
<option value="A">Apple</option>
<option value="C">Cars</option>
<option value="H">Honda</option>
<option value="F">Fiat</option>
<option value="I">Indigo</option>
</select>
Вы можете сделать это на чистом JavaScript:
var selectobject = document.getElementById("mySelect");
for (var i=0; i<selectobject.length; i++) {
if (selectobject.options[i].value == 'A')
selectobject.remove(i);
}
Но, как показывают другие ответы, гораздо проще использовать jQuery или какую-либо другую библиотеку JS.
Ответ 2
Проверьте решение JQuery здесь
$("#selectBox option[value='option1']").remove();
Ответ 3
с чистым javascript
var condition = true; // your condition
if(condition) {
var theSelect = document.getElementById('val');
var options = theSelect.getElementsByTagName('OPTION');
for(var i=0; i<options.length; i++) {
if(options[i].innerHTML == 'Apple' || options[i].innerHTML == 'Cars') {
theSelect.removeChild(options[i]);
i--; // options have now less element, then decrease i
}
}
}
не протестирован с IE (если кто-то может подтвердить это...)
Ответ 4
Как уже упоминалось, при удалении опции длина элемента select уменьшается. Если вы просто хотите удалить одну опцию, это не проблема, но если вы намереваетесь удалить несколько опций, у вас могут возникнуть проблемы. Некоторые предлагали уменьшить индекс вручную при удалении опции. По моему мнению, уменьшение индекса внутри цикла for не очень хорошая идея. Вот почему я бы предложил немного другой цикл for, в котором мы перебираем все опции сзади.
var selectElement = document.getElementById("selectId");
for (var i = selectElement.length - 1; i >= 0; i--){
if (someCondition) {
selectElement.remove(i);
}
}
Если вы хотите удалить все опции, вы можете сделать что-то вроде этого.
var selectElement = document.getElementById("selectId");
while (selectElement.length > 0) {
selectElement.remove(0);
}
Ответ 5
Если вы используете JQuery, он выглядит следующим образом:
Дайте идентификатор вашему SELECT
<select name="val" size="1" id="val">
<option value="A">Apple</option>
<option value="C">Cars</option>
<option value="H">Honda</option>
<option value="F">Fiat</option>
<option value="I">Indigo</option>
</select>
$("#val option[value='A'],#val option[value='C']").remove();
Ответ 6
Индекс я изменится, как только он удалит 1-й элемент.
Этот код удалит значения 52-140 из комбинированного поля wifi channel
obj = document.getElementById("id");
if (obj)
{
var l = obj.length;
for (var i=0; i < l; i++)
{
var channel = obj.options[i].value;
if ( channel >= 52 && channel <= 140 )
{
obj.remove(i);
i--;//after remove the length will decrease by 1
}
}
}
Ответ 7
document.getElementById(this).innerHTML = '';
Поместите его в ваш if-case. То, что он делает, это просто проверить текущий объект в документе и заменить его на ничего. Сначала вы сначала перейдете через список, я предполагаю, что вы уже это делаете, поскольку у вас есть это, если.
Ответ 8
Вы можете использовать:
if ( frm.product.value=="F" ){
var $select_box = $('[name=val]');
$select_box.find('[value=A],[value=C]').remove();
}
Обновить. Если вы немного измените свой поле выбора на
<select name="val" size="1" >
<option id="A" value="A">Apple</option>
<option id="C" value="C">Cars</option>
<option id="H" value="H">Honda</option>
<option id="F" value="F">Fiat</option>
<option id="I" value="I">Indigo</option>
</select>
решение, отличное от jQuery, будет
if ( frm.product.value=="F" ){
var elem = document.getElementById('A');
elem.parentNode.removeChild(elem);
var elem = document.getElementById('C');
elem.parentNode.removeChild(elem);
}
Ответ 9
if(frm.product.value=="F"){
var select = document.getElementsByName('val')[0];
select.remove(0);
select.remove(1);
}
Ответ 10
Вам нужно перейти к его родительскому объекту и удалить его там в javascript.
"Javascript не позволит элементу совершить самоубийство, но он допускает детоубийство"..:)
попробуйте это,
var element=document.getElementsByName(val))
element.parentNode.removeChild(element.options[0]); // to remove first option
Ответ 11
Это должно сделать это
document.getElementsByName("val")[0].remove(0);
document.getElementsByName("val")[0].remove(0);
Проверьте скрипт здесь
Ответ 12
В качестве альтернативы вы также можете выполнить это с помощью getElementsByName
<select id="mySelect" name="val" size="1" >
<option value="A">Apple</option>
<option value="C">Cars</option>
<option value="H">Honda</option>
<option value="F">Fiat</option>
<option value="I">Indigo</option>
</select>
Таким образом, при сопоставлении значения параметра "C" мы можем удалить "Автомобили" из списка.
var selectobject = document.getElementsByName('val')[0];
for (var i=0; i<selectobject.length; i++){
if (selectobject.options[i].value == 'C' )
selectobject.remove(i);
}
Ответ 13
Для сброса всех параметров ru Важно en ЗА: удалить (0) - Важно: 0
var select = document.getElementById("element_select");
var length = select.length;
for (i = 0; i < length; i++) {
select.remove(0);
// or
// select.options[0] = null;
}
Ответ 14
Удаление опции
$("#val option[value='A']").remove();