Форум

nurik2120 · #1 (**permalink**) 18.06.2013, 09:06

Здравствуйте помогите написать скрипт

есть список select list и блоки

<select id="edit-type" class="form-select" name="type" >
<option selected="selected" 	value="All">---------</option>
<option class="a" value="a">a</option>
<option class="b" value="b">b</option>
<option class="c" value="c">c</option>
</select>

<div class="a" style="display:none"> a</div>
<div class="b" style="display:none">b</div>
<div class="c" style="display:none">c</div>
<div class="a b" style="display:none">a b</div>
<div class="b c" style="display:none">a b</div>

допустим при выборе из списка пункта "b" все блоки которые содержат class "b" должны поменять стиль на display: block

это следующие блоки

<div class="a b" style="display:none">a b</div>
<div class="b c" style="display:none">a b</div>
<div class="b" style="display:none">b</div>

ksa · #2 (**permalink**) 18.06.2013, 09:26

Сообщение от nurik2120

помогите написать скрипт

Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(document).ready(function (){
	$('#edit-type').change(function (){
		$('#container > div').hide();
		$('#container > .'+this.value).show();
	});
});
</script>
</head>
<body>
<select id="edit-type" class="form-select" name="type" >
	<option value="All">---------</option>
	<option class="a" value="a">a</option>
	<option class="b" value="b">b</option>
	<option class="c" value="c">c</option>
</select>
<div id='container'>
	<div class="a" style="display:none"> a</div>
	<div class="b" style="display:none">b</div>
	<div class="c" style="display:none">c</div>
	<div class="a b" style="display:none">a b</div>
	<div class="b c" style="display:none">b c</div>
</div>
</body>
</html>

nurik2120 · #3 (**permalink**) 18.06.2013, 10:25

Сообщение от ksa

Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(document).ready(function (){
	$('#edit-type').change(function (){
		$('#container > div').hide();
		$('#container > .'+this.value).show();
	});
});
</script>
</head>
<body>
<select id="edit-type" class="form-select" name="type" >
	<option value="All">---------</option>
	<option class="a" value="a">a</option>
	<option class="b" value="b">b</option>
	<option class="c" value="c">c</option>
</select>
<div id='container'>
	<div class="a" style="display:none"> a</div>
	<div class="b" style="display:none">b</div>
	<div class="c" style="display:none">c</div>
	<div class="a b" style="display:none">a b</div>
	<div class="b c" style="display:none">b c</div>
</div>
</body>
</html>

скажите у меня на сайте подключены эти библиотеки
<script src="jquery.js?v=1.4.4" type="text/javascript">
<script src="jquery.once.js?v=1.2" type="text/javascript">

нужно ли вашу подключать?

ksa · #4 (**permalink**) 18.06.2013, 10:43

Сообщение от nurik2120

нужно ли вашу подключать?

Проверь сам, это не трудно...

nurik2120 · #5 (**permalink**) 18.06.2013, 10:59

Сообщение от ksa

Проверь сам, это не трудно...

Оказалось что нужно))
большое спасибо за помощь)

Форум

Справочник

Discord чат

Курсы javascript