Уменьшить размер скрипта

[nurik2120]

Доброго времени суток не подскажите как уменьшить размер скрипта а то еще добавить надо десять блоков и тогда скрипт будет огромным
вот сам скрипт

function toggle(switchElement) {
 
  var avto = document.getElementById('avto');
  var moto = document.getElementById('moto');
  var shlemi = document.getElementById('shlemi');
  var furgon_do = document.getElementById('furgon_do');
  var gruz_sv = document.getElementById('gruz_sv');
    if (switchElement.value == 'avto') {
      avto.style.display = '';
      moto.style.display = 'none';
	  shlemi.style.display = 'none';
	  furgon_do.style.display = 'none';
	  gruz_sv.style.display = 'none';
    }
    else if (switchElement.value == 'moto') {
      avto.style.display = 'none';
	  shlemi.style.display = 'none';
	  furgon_do.style.display = 'none';
      moto.style.display = '';
	  gruz_sv.style.display = 'none';
    }
	else if (switchElement.value == 'shlemi') {
      avto.style.display = 'none';
	  shlemi.style.display = '';
      moto.style.display = 'none';
	  furgon_do.style.display = 'none';
	  gruz_sv.style.display = 'none';
    }
	else if (switchElement.value == 'furgon_do') {
      avto.style.display = 'none';
	  shlemi.style.display = 'none';
      moto.style.display = 'none';
	  furgon_do.style.display = '';
	  gruz_sv.style.display = 'none';
    }
	else if (switchElement.value == 'gruz_sv') {
      avto.style.display = 'none';
	  shlemi.style.display = 'none';
      moto.style.display = 'none';
	  furgon_do.style.display = 'none';
	  gruz_sv.style.display = '';
    }
	else if (switchElement.value != 'moto' && switchElement.value != 'avto') {
      avto.style.display = 'none';
     moto.style.display = 'none';
    }
  }

вот html

<select name="select_left"  size="1" id="select_left_id" onChange="toggle(this);">
			<option selected="selected" value="avto" onClick="toggle(this);">Автомобили</option>
			<option value="moto" onClick="toggle(this);">Мотоциклы</option>
			<option value="shlemi" onClick="toggle(this);">Одежда шлемы</option>
			<option value="furgon_do" onClick="toggle(this);">Фургоны, грузовые автомобили до 7,5т</option>
			<option value="gruz_sv" onClick="toggle(this);">Грузовые автомобили свыше 7,5т</option>
			</select>
<div id="avto" style="display: block;">...</div>
<div id="moto" style="display: none;">...</div>
. . . . .

[Akalenik]

Объяви изначально при вызове функции все *.style.display в none:

avto.style.display = 'none';
moto.style.display = 'none';
shlemi.style.display = 'none';
furgon_do.style.display = 'none';
gruz_sv.style.display = 'none';

А дальше при else/if изменяй на '' только одно нужное тебе значение.

[danik.js]

<select name="select_left"  size="1" id="select_left_id">
    <option selected="selected" value="avto">Автомобили</option>
    <option value="moto">Мотоциклы</option>
    <option value="shlemi">Одежда шлемы</option>
    <option value="furgon_do">Фургоны, грузовые автомобили до 7,5т</option>
    <option value="gruz_sv">Грузовые автомобили свыше 7,5т</option>
</select>
<script>
(function(){
    var select = document.getElementById('select_left_id');
    select.onchange = function(){
        for (var i = 0, option; option = select[i]; i++) {
            var block = document.getElementById(option.value);
            block.style.display = option.selected ? 'block' : 'none';
        }
    }
})();
</script>
<div id="avto" style="display: block;">avto</div>
<div id="moto" style="display: none;">moto</div>
<div id="shlemi" style="display: none;">shlemi</div>
<div id="furgon_do" style="display: none;">furgon_do</div>
<div id="gruz_sv" style="display: none;">gruz_sv</div>

[Deff]

function toggle(val) {
 var elemId =['avto','moto','shlemi','furgon_do','gruz_sv'];
 function setToddle(a) {
    for(var i=0;i<elemId.length;i++) {
        var tmp=(!+a[i]) ? 'none':'';
        document.getElementById(elemId[i]).style.display=tmp;
    }
 }

 var obj = {
	   avto:    	'10000',
	   moto:    	'01000',
	   shlemi:  	'00100',
	   furgon_do:	'00010',
	   gruz_sv: 	'00001',
	   esly_else: 	'00'
    }

 for(var key in obj) {
        if(val==key) {
	  var setArray = obj[key].split('');setToddle(setArray);return;
        }

 }
	  var setArray = obj.esly_else.split('');setToddle(setArray);//если соответствует 'else'

}

[danik.js]

Оу, даже с элементами криптографии ) Круто, че )

[рони]

nurik2120,
Вариант ...

<!DOCTYPE HTML>
<html>
<head>
  <title></title>
<meta charset="utf-8" />
</head>
<body>
<select name="select_left"  size="1" id="select_left_id">
    <option selected="selected" value="avto">Автомобили</option>
    <option value="moto">Мотоциклы</option>
    <option value="shlemi">Одежда шлемы</option>
    <option value="furgon_do">Фургоны, грузовые автомобили до 7,5т</option>
    <option value="gruz_sv">Грузовые автомобили свыше 7,5т</option>
</select>
<div id="avto" style="display: block;">avto</div>
<div id="moto" style="display: none;">moto</div>
<div id="shlemi" style="display: none;">shlemi</div>
<div id="furgon_do" style="display: none;">furgon_do</div>
<div id="gruz_sv" style="display: none;">gruz_sv</div>
<script>
(function () {
    var c = document.getElementById("select_left_id"),
        a = document.getElementById("avto");
    c.onchange = function () {
        var b = document.getElementById(this.value);
        b.style.display = "block";
        a.style.display = "none";
        a = b
    }
})();
</script>
</body>
</html>

[nurik2120]

var setElem =[avto,shlemi,furgon_do.,moto,gruz_sv]

оказалось тут точка лишняя )) а так всем спасибо хотелось бы узнать как добавить тут еще один пункт
11 avto:'10000',
12 moto:'00010',
13 shlemi:'01000',
14 furgon_do:'00010',
15 gruz_sv:'00001

[nurik2120]

столько вариантов аж глаза разбегаются))

[danik.js]

У рони самый простой и быстрый вариант. Можно еще отвязаться от id-шника auto через c.value

[Deff]

хотелось бы узнать как добавить тут еще один пункт

Наверно в elemId и в obj
в obj - число знаков 00000 - соответствует колву элементов в elemId
1 - у которого .style.display = '';