Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.11.2011, 03:55
Интересующийся
Отправить личное сообщение для iskiz Посмотреть профиль Найти все сообщения от iskiz
 
Регистрация: 03.11.2011
Сообщений: 10

JQuery и Select
Здравствуйте. Хочу сделать вывод определенного блока при выборе нужной строки в "select"

Есть такой скрипт:

$(document).ready(function(){
  $("select#category").change(function (){
     if ($("#category option:selected").val() == "мой value"){
         $("#trackershow").show();
     }
     else
     {
         $("#trackershow").hide();
     }
  });
});


Не могу сделать так, чтобы можно было вбить к примеру 5 моих "value". Я так понимаю, что нужно в "array" вбить через запятую и сделать поиск по массиву. Но к сожалению я пока новичок в этих вопросах. Могли бы Вы подсказать как реализовать данный скрипт.
Ответить с цитированием
  #2 (permalink)  
Старый 03.11.2011, 08:45
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,205

Сообщение от iskiz
Хочу сделать вывод определенного блока при выборе нужной строки в "select"
Есть такой скрипт:
А зачем нам не работоспособный скрипт? Ты лучше хтмл свой покажи... С селектом и дивами...
Ответить с цитированием
  #3 (permalink)  
Старый 03.11.2011, 13:54
Интересующийся
Отправить личное сообщение для iskiz Посмотреть профиль Найти все сообщения от iskiz
 
Регистрация: 03.11.2011
Сообщений: 10

Сообщение от ksa Посмотреть сообщение
А зачем нам не работоспособный скрипт? Ты лучше хтмл свой покажи... С селектом и дивами...
Скрипт, который выше, работает. С дивами выглядит так:

<script>
$(document).ready(function(){
  $("select#category").change(function (){
     if ($("#category option:selected").val() == "99"){
         $("#trackershow").show();
     }
     else
     {
         $("#trackershow").hide();
     }
  });
});
</script>

<select name="catlist[]" id="category" onchange="onCategoryChange(this.value)" style="width:302px;height:22px">
<option style="color: black" value="11">Текст1</option>
<option style="color: black" value="22">Текст2</option>
<option style="color: black" value="33">Текст3</option>
<option style="color: black" value="44">Текст4</option>
<option style="color: black" value="55">Текст4</option>
<option style="color: black" value="66">Текст6</option>
<option style="color: black" value="77">Текст7</option>
<option style="color: black" value="88">Текст8</option>
<option style="color: black" value="99">Текст9</option>
</select>

<div id="trackershow" style="display:none">Любой контент</div>


При выборе последней строки в "Select" ("Текст 9" которая), див отображается, при других вариантах див скрыт.

Мне нужно в скрипт добавить несколько значений "value". Подскажите как это сделать?
Ответить с цитированием
  #4 (permalink)  
Старый 03.11.2011, 14:05
Интересующийся
Отправить личное сообщение для iskiz Посмотреть профиль Найти все сообщения от iskiz
 
Регистрация: 03.11.2011
Сообщений: 10

Пока что сделал через "else if", но в таком случае скрипт сильно длинный получается. Может возможно в "var" сбить все значения "value"? Незнаю только как написать это, чтобы работало
Ответить с цитированием
  #5 (permalink)  
Старый 03.11.2011, 14:25
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,205

Сообщение от iskiz
Незнаю только как написать это, чтобы работало
Например вот так...

<!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">
.container {
	display: none;
}
#category {
	width: 302px;
	height: 22px;
}
#category option {
	color: black;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
	$("#category").click(function (){
		var id=this.value;
		$("#container > div").hide();
		$("#cn"+id).show();
	});
});
</script>
</head>
<body>
<select name="catlist[]" id="category">
	<option></option>
	<option value="11">Текст1</option>
	<option value="22">Текст2</option>
	<option value="33">Текст3</option>
	<option value="44">Текст4</option>
	<option value="55">Текст5</option>
	<option value="66">Текст6</option>
	<option value="77">Текст7</option>
	<option value="88">Текст8</option>
	<option value="99">Текст9</option>
</select>
<div id="container">
	<div id="cn11" class="container">Контент 11</div>
	<div id="cn22" class="container">Контент 22</div>
	<div id="cn33" class="container">Контент 33</div>
	<div id="cn44" class="container">Контент 44</div>
	<div id="cn55" class="container">Контент 55</div>
	<div id="cn66" class="container">Контент 66</div>
	<div id="cn77" class="container">Контент 77</div>
	<div id="cn88" class="container">Контент 88</div>
	<div id="cn99" class="container">Контент 99</div>
</div>
</body>
</html>
Ответить с цитированием
  #6 (permalink)  
Старый 03.11.2011, 14:57
Интересующийся
Отправить личное сообщение для iskiz Посмотреть профиль Найти все сообщения от iskiz
 
Регистрация: 03.11.2011
Сообщений: 10

Немного меня не поняли. А вообще круто - для каждого "value" свой вывод. Но тут задача в чем? У меня есть кнопка "Добавить файл" и нужно, чтобы эта кнопка отображалась только при выборе категорий "Файлы, Видео, Музыка"

Так получится?

<script src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
.container {
	display: none;
}
#category {
	width: 302px;
	height: 22px;
}
#category option {
	color: black;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
	$("#category").click(function (){
		var id=new Array("77, 88, 99");
		$("#container > div").hide();
		$("#cn"+id).show();
	});
});
</script>
<select name="catlist[]" id="category">
	<option></option>
	<option value="11">Текст1</option>
	<option value="22">Текст2</option>
	<option value="33">Текст3</option>
	<option value="44">Текст4</option>
	<option value="55">Текст5</option>
	<option value="66">Текст6</option>
	<option value="77">Музыка</option>
	<option value="88">Видео</option>
	<option value="99">Файлы</option>
</select>
<div id="container">
	<div id="cn11" class="container">Контент 11</div>
</div>


Такое чувство, что что-то тут неправильно
Ответить с цитированием
  #7 (permalink)  
Старый 03.11.2011, 15:07
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,205

Сообщение от iskiz
Немного меня не поняли.
ну конечно!
Сообщение от iskiz
У меня есть кнопка "Добавить файл" и нужно, чтобы эта кнопка отображалась только при выборе категорий "Файлы, Видео, Музыка"
Как же я сразу-то не догадался!

<!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">
#container {
	display: none;
}
#category {
	width: 302px;
	height: 22px;
}
#category option {
	color: black;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
	$("#category").click(function (){
		var typ=this.options[this.selectedIndex].className;
		if (typ=='file') {
			$("#container").show();
		} else {
			$("#container").hide();
		};
	});
});
</script>
</head>
<body>
<select name="catlist[]" id="category">
	<option></option>
	<option value="11">Текст1</option>
	<option value="22">Текст2</option>
	<option value="33">Текст3</option>
	<option value="44">Текст4</option>
	<option value="55">Текст5</option>
	<option value="66">Текст6</option>
	<option class='file' value="77">Музыка</option>
	<option class='file' value="88">Видео</option>
	<option class='file' value="99">Файлы</option>
</select>
<div id="container">
	<button>Добавить файл</button>
</div>
</body>
</html>
Ответить с цитированием
  #8 (permalink)  
Старый 03.11.2011, 15:13
Интересующийся
Отправить личное сообщение для iskiz Посмотреть профиль Найти все сообщения от iskiz
 
Регистрация: 03.11.2011
Сообщений: 10

Сообщение от ksa Посмотреть сообщение
Как же я сразу-то не догадался!
Блин Ну будем наедятся, что это я пишу последний раз А то скоро надоем...

Видимо я плохо расписал ситуацию - "намотаю на ус" на будущее

К сожалению я немогу в "select" дописать классы только для нужных "option", так как этот селект ПХП скриптом генерируется. Могу отталкиваться только от значений "value" либо непосредственно от самого текста(например: "Музыка").

Есть идеи? Кстати спасибки за помощь
Ответить с цитированием
  #9 (permalink)  
Старый 03.11.2011, 15:15
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,205

Сообщение от iskiz
этот селект ПХП скриптом генерируется
Ну так сгенери его как нужно. Зачем себе проблемы лишние создавать...
Ответить с цитированием
  #10 (permalink)  
Старый 03.11.2011, 15:20
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,205

Сообщение от iskiz
Могу отталкиваться только от значений "value" либо непосредственно от самого текста(например: "Музыка")
Это ущербный подход...

<!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">
#container {
	display: none;
}
#category {
	width: 302px;
	height: 22px;
}
#category option {
	color: black;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
	$("#category").click(function (){
		var typ={
			77: true,
			88: true,
			99: true
		}
		var val=this.value;
		if (typ[val]) {
			$("#container").show();
		} else {
			$("#container").hide();
		};
	});
});
</script>
</head>
<body>
<select name="catlist[]" id="category">
	<option></option>
	<option value="11">Текст1</option>
	<option value="22">Текст2</option>
	<option value="33">Текст3</option>
	<option value="44">Текст4</option>
	<option value="55">Текст5</option>
	<option value="66">Текст6</option>
	<option class='file' value="77">Музыка</option>
	<option class='file' value="88">Видео</option>
	<option class='file' value="99">Файлы</option>
</select>
<div id="container">
	<button>Добавить файл</button>
</div>
</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Динамически загружаемая jQuery и jQuery-функции в одном файле 67bytes Общие вопросы Javascript 6 06.03.2013 09:01
Проблема с динамическим формированием select elepsion jQuery 1 31.10.2010 14:31
Каскадный список + jquery 1.4.2 bobo123456 jQuery 0 02.04.2010 21:59
jQuery jTreeMenu plugin Seafnox jQuery 9 12.01.2010 21:55
JQuery + FireFox NOOB jQuery 4 02.11.2009 18:16