Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   Не работает скрипт в Chrome (https://javascript.ru/forum/css-html/58242-ne-rabotaet-skript-v-chrome.html)

SuperTester 11.09.2015 08:41

Не работает скрипт в Chrome
 
Есть скрипты:
function hidebyid(id){
var el = document.getElementById(id);
el.style.display='none';
}

function showbyid(id){
var el = document.getElementById(id);
el.style.display='inline-block';
}


имеем следующий код в форме заказа, который скрывает/отображает определенные select-ы:

<div class="row">
			<label>Тип конструкции</label>
			<select name="name_construction">
				<option onClick="hidebyid('row_gazebo'); hidebyid('row_kozyrki'); hidebyid('row_kyrilki'); showbyid('row_canopy');">Навес</option>
				<option onClick="hidebyid('row_canopy'); hidebyid('row_kozyrki'); hidebyid('row_kyrilki'); showbyid('row_gazebo');">Беседка</option>
				<option onClick="hidebyid('row_canopy'); hidebyid('row_gazebo'); hidebyid('row_kyrilki'); showbyid('row_kozyrki');">Козырек</option>
				<option onClick="hidebyid('row_canopy'); hidebyid('row_gazebo'); hidebyid('row_kozyrki'); showbyid('row_kyrilki');">Курилка</option>
				<option onClick="hidebyid('row_canopy'); hidebyid('row_gazebo'); hidebyid('row_kozyrki'); hidebyid('row_kyrilki');">Гараж</option>
				<option onClick="hidebyid('row_canopy'); hidebyid('row_gazebo'); hidebyid('row_kozyrki'); hidebyid('row_kyrilki');">Хоз. блок</option>
			</select>
		</div>
	
	
		<div class="row" id="row_canopy">
			<label>Название</label>
			<select name="name_canopy">
				<option>Круглый</option>
				<option>Прямоугольный</option>
				<option>Приставной</option>
				<option>Квадратный</option>
				<option>Навес над крыльцом</option>
				<option>Рокстил</option>
				<option>Мини навес</option>
				<option>Раундруф</option>
			</select>
		</div>
		
		<div class="row hidden" id="row_gazebo">
			<label>Название</label>
			<select name="name_gazebo">
				<option>Прямоугольная</option>
				<option>Круглая</option>
				<option>Приставная</option>
				<option>Квадратная</option>
				<option>С лавочками</option>
			</select>
		</div>
		
		<div class="row hidden" id="row_kozyrki">
			<label>Название</label>
			<select name="name_kozyrki">
				<option>Атлас</option>
				<option>Орион</option>
				<option>Сириус</option>
				<option>Сириус Лайн</option>
				<option>Оран</option>
				<option>Оран Р</option>
				<option>Сол</option>
				<option>Трим</option>
				<option>Волна</option>			
			</select>
		</div>
		
		<div class="row hidden" id="row_kyrilki">
			<label>Название</label>
			<select name="name_kyrilki">
				<option>Квадро</option>
				<option>Стандарт</option>		
			</select>
		</div>


По какой-то причине эта конструкция не работает в Google Chrome. Живой код - http://new.lnebo.ru/order/

Буду благодарен за помощь.

рони 11.09.2015 09:07

Цитата:

Сообщение от SuperTester
option onClick

не делайте так!
есть select onchange=

SuperTester 11.09.2015 10:02

Спасибо за подсказку, доработал. Посмотрите, пожалуйста, все ли верно. Немного громоздко получилось, но как смог:

function Selected(a) {
        var label = a.value;
        if (label==1) {
            document.getElementById("row_canopy").style.display='block';
            document.getElementById("row_gazebo").style.display='none';
            document.getElementById("row_kyrilki").style.display='none';  
            document.getElementById("row_kozyrki").style.display='none';  			
        } else if (label==2) {
		    document.getElementById("row_gazebo").style.display='block';
            document.getElementById("row_canopy").style.display='none';
            document.getElementById("row_kyrilki").style.display='none';  
            document.getElementById("row_kozyrki").style.display='none';  	 
        } else if (label==3) {
		    document.getElementById("row_kyrilki").style.display='block';  
			document.getElementById("row_canopy").style.display='none';
		    document.getElementById("row_gazebo").style.display='none';
            document.getElementById("row_kozyrki").style.display='none';  	 
        } else if (label==4) {
		    document.getElementById("row_kozyrki").style.display='block';  
			document.getElementById("row_canopy").style.display='none';
		    document.getElementById("row_gazebo").style.display='none';
            document.getElementById("row_kyrilki").style.display='none';  	 
        } else {
            document.getElementById("row_canopy").style.display='none';
            document.getElementById("row_gazebo").style.display='none';
            document.getElementById("row_kyrilki").style.display='none';  
            document.getElementById("row_kozyrki").style.display='none';  
        }
}

<div class="row">
			<label>Тип конструкции</label>
			<select name="name_construction" onChange="Selected(this)">
				<option value="1">Навес</option>
				<option value="2">Беседка</option>
				<option value="3">Козырек</option>
				<option value="4">Курилка</option>
				<option value="5">Гараж</option>
				<option value="6">Хоз. блок</option>
			</select>
		</div>

рони 11.09.2015 10:13

SuperTester,
все скрыть вначале -- потом открыть нужный по условию - глядишь на десяток строк короче будет

SuperTester 11.09.2015 14:28

спасибо


Часовой пояс GMT +3, время: 14:29.