Отмените выбор всех опций в множественном выборе с 1 опцией - PullRequest
3 голосов
/ 06 апреля 2010

У меня сейчас следующий код js

function clearMulti(option)
{
    var i;
    var select = document.getElementById(option.parentNode.id);
    for(i=1;i<select.options.length;i++)
         {
        select.options[i].selected=false;
    }
}

и

function clearAllOpt(select)
{
    select.options[0].selected = false;
}

Первый отменяет выбор всех параметров в множественном выборе при вызове, а второй очищает первый параметр при выборе чего-либо еще.

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

В FF все работает отлично, но в IE8 ничего не происходит ... есть предложения о том, как заставить это работать в обоих?

Это вызывается со страницы jsp ... код ниже - были внесены изменения в то, как заполняются идентификаторы и так далее, поскольку это информация о базе данных и другие вещи, которые я, вероятно, не должен выдавать :), но это должно дать вам информация, которую вы ищете.

<select id="blahSelect" name="blahSelect" style="width:80%" size=7 multiple>
     <option id="All Blah" onclick="clearMulti(this)">All Blah</option>
     <option id="**from sql**" onclick="clearAllOpt(this.parentNode)">**from sql**</option>
</select>

Заранее спасибо.

Ответы [ 6 ]

6 голосов
/ 14 января 2015

Пусть это легко

select.selectedIndex = -1;

Примечание : значение «-1» отменяет выбор всех параметров (если есть).

Источник: http://www.w3schools.com/jsref/prop_select_selectedindex.asp

3 голосов
/ 06 апреля 2010

IE8 не запускает события onclick для элементов option.

Также обратите внимание, что selectedIndex возвращает первый выбранный параметр и не изменяется в соответствии с последним выбранным вариантом. Это приводит к проблемам, когда проверяется ВСЕ, и вы пытаетесь проверить другие параметры, удерживая клавишу CTRL.

Вы можете попробовать что-то вроде этого:

<script type="text/javascript">
function excludeFirstOption(select) {

    if (select.selectedIndex === 0) {
        for (var i=0; i<select.options.length; i++) {
            select.options[i].selected = false;
        }
    }
}
</script>

<select size="7" multiple="multiple" onchange="excludeFirstOption(this)">
     <option>All</option>
     <option>Item 1</option>
     <option>Item 2</option>
     <option>Item 3</option>
     <option>Item 4</option>
</select>
1 голос
/ 06 апреля 2010

Вместо отдельного onclick = "" для каждой опции, попробуйте onchange = "" на select:

document.getElementById("bar").onchange=function(){
    if(this.options.selectedIndex > 0){
        /* deselect this.options[0] */
    }else{
        /* deselect this.options[1-n] */
    }
}

и в HTML:

<select id="bar">
    <option>ALL</option>
    <option>option 1</option>
    <option>option 2</option>
    ...
    <option>option n</option>
</select>
0 голосов
/ 27 июля 2018

Это не работает в IE, но элегантное решение состоит в том, чтобы классифицировать select (ы) с именем, а затем подпрограмма onload body подключает опции для каждого select этого класса: -

<html>
<head>
<script>
function filtddchg()
{
  if (this.value.length==0) this.parentElement.selectedIndex=0;
  else this.parentElement.options[0].selected=false;
  return true;
}

function init()
{
  var ii,jj,ary=document.getElementsByClassName("ddflt");
  for (ii=0;ii<ary.length;++ii) for (jj=0;jj<ary[ii].length;++jj)
    ary[ii].options[jj].onclick=filtddchg;
}
</script>
</head>

<body onload="init();">
<b>Country</b><br>
<select name="cntry" id="cntry" multiple size=6 class="ddflt">
<option value="" selected>-All Countries-</option>
<option value="1">UK</option>
<option value="2">France</option>
<option value="3">Germany</option>
<option value="4">Spain</option>
<option value="5">Italy</option>
</select>
</body>
</html>
0 голосов
/ 30 октября 2012

Просто сделайте это:

$('#mySelectList').val('');
0 голосов
/ 06 апреля 2010

Есть несколько проблем с этим кодом

1.) Document.getElementById (option.parentNode.id);

Почему вы получаете элемент по id, когда у вас уже есть элемент? Вы должны просто сделать var select = option.parentNode

2.) Я бы не назвал переменную select - назову ее более подходящей. Это не резервируемый, но полузарезервированный, поскольку он используется во многих объектах. Так - var mySelectBoy = option.parentNode

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...