2009-07-20 2 views
0

У меня есть n количество вариантов в поле выбора. После того, как пользователь выберет один или несколько вариантов в поле выбора и отправит форму, мне нужно проверить, что пользователь не выбрал более четырех вариантов.Как ограничить количество выбранных вариантов в списке с несколькими вариантами выбора с помощью JavaScript?

Я попытался следующие:

function howMany() { 
    var selObj = document.getElementsByName('xid[]'); 

    var totalChecked = 0; 

    for (i = 0; i < selObj.options.length; i++) { 
     if (selObj.options[i].selected) { 
      totalChecked++; 
     } 
    } 
    if (totalChecked > 4) { 
     alert("You can't check more than 4 options"); 
     return false; 
    } 
    return true; 
} 
+5

Несколько вариантов выбора - довольно неприятный пользовательский интерфейс, с которым сталкиваются многие пользователи. Вместо этого я предлагаю перейти на группу флажков. – Quentin

ответ

-1

если это простой javascript .. здесь вы идете.

<pre> 
<html> 
    <script> 
     function howMany() { 
       var selObj = document.getElementById('paramid[]'); 
       var totalChecked = 0; 
       for (i = 0; i < selObj.options.length; i++) { 
        if (selObj.options[i].selected) { 
         totalChecked++; 
        } 
       } 
       alert(totalChecked); 
       if (totalChecked > 4) { 
        alert("You can't check more than 4 options"); 
        return false; 
       } 
       return true; 
     } 
     function testSubmit() { 
      return howMany(); 
     } 
    </script> 
    <body> 
     <form action="http://google.com"> 
      <select name="paramid[]" id="paramid[]" multiple> 
       <option>TEST1</option 
       <option>TEST2</option 
       <option>TEST3</option 
       <option>TEST4</option 
       <option>TEST5</option 
       <option>TEST6</option 
       <option>TEST7</option 
      </select> 
      <input type="submit" onclick="return testSubmit()" name="s" value=" How Many " id="s"/> 
     </form> 
    </body> 
</html> 
</pre> 
+0

Ваше форматирование разбито, и вы, вероятно, должны упомянуть, что для этого требуется, чтобы HTML был изменен (вы также должны его исправить, чтобы он не изменял HTML так, чтобы он был недопустимым, [и] не разрешены в атрибутах id в HTML). – Quentin

2

Ключ во имя первого объекта DOM вы звоните по телефону: получить Элементы Byname

Это возвращает список узлов всех элементов, которые имя. Вы хотите вырезать первый из списка.

 var selObj = document.getElementsByName('paramid[]')[0]; 

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

 var selObj = myForm.elements['paramid[]'] 

& hellip; где myForm - ссылка на форму (которую вы могли бы получить от this, если вы использовали эту функцию как обработчик события отправки).