Показать сообщение отдельно
  #2 (permalink)  
Старый 14.07.2019, 10:18
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,133

zava75,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
$(function() {
    $(".required[master-option!=0]").hide();
    $(".radio input[option-value]").on("click", function() {
        $(".required[master-option!=0], .required[master-option!=0] .radio").hide();

        function tree(input) {
            var num = $(input).attr("option-value");
            $(".required [master-option-value=" + num + "]").show().parents(".required, .radio").show();
            $(".required [master-option-value=" + num + "]:checked").each(function(i, input) {
                tree(input)
            })
        }
        $(".required [master-option-value=0]:checked").each(function(i, input) {
            tree(input)
        })
    })
});
  </script>
</head>

<body>
<div class="product-options">
		<h3>Доступные варианты</h3>

		<div class="required" master-option="0" id="option-13">
			<label class="control-label">Цвет</label>
			<div id="input-option13">
				<div class="radio">
					<label>
						<input type="radio" name="option[13]" value="18" id="option-value-18" master-option-value="0" option-value="3">
						<img src="">
						<span class="option-value">Белый</span>
					</label>
				</div>
				<div class="radio">
					<label>
						<input type="radio" name="option[13]" value="24" id="option-value-24" master-option-value="0" option-value="16">
						<img src="">
						<span class="option-value">Чёрный</span>

					</label>
				</div>
			</div>
		</div>

		<div class="required" master-option="2" id="option-14">
			<label class="control-label">Производительность (охл./обогрев), кВT</label>
			<div id="input-option14">
				<div class="radio">
					<label>
						<input type="radio" name="option[14]" value="19" id="option-value-19" master-option-value="3" option-value="17">
						<span class="option-value">2,2/2,3</span>
					</label>
				</div>
				<div class="radio" >
					<label>
						<input type="radio" name="option[14]" value="25" id="option-value-25" master-option-value="16" option-value="17">
						<span class="option-value">2,2/2,3</span>

					</label>
				</div>
				<div class="radio">
					<label>
						<input type="radio" name="option[14]" value="20" id="option-value-20" master-option-value="3" option-value="18">
						<span class="option-value">2,5/2,8</span>

					</label>
				</div>
			</div>
		</div>

		<div class="required" master-option="3" id="option-18">
			<label class="control-label">Потребляемая мощность (охл./обогрев), кВТ</label>
			<div id="input-option18">
				<div class="radio" >
					<label>
						<input type="radio" name="option[18]" value="26" id="option-value-26" master-option-value="17" option-value="9">
						<span class="option-value">0,69/0,63</span>
					</label>
				</div>
				<div class="radio" >
					<label>
						<input type="radio" name="option[18]" value="21" id="option-value-21" master-option-value="17" option-value="9">
						<span class="option-value">0,69/0,63</span>
					</label>
				</div>
				<div class="radio">
					<label>
						<input type="radio" name="option[18]" value="22" id="option-value-22" master-option-value="18" option-value="22">
						<span class="option-value">0,78/0,72</span>
					</label>
				</div>
			</div>
		</div>
	</div>

</body>
</html>
Ответить с цитированием