Javascript.RU

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

Выделение строки <select> при выборе checkbox
Народ помогите! как сделать так чтоб при выборе чекбокса выдилялась соответствующая строка в списке Если выбираешь например в чекбоксах 1,3 соответствующие 1,3 выдиляются в списке.
<form action="http://localhost:8080/webstream/index.php" method="post" name="attr_search">
<input value="1" type="checkbox">1<br>
<input value="2" type="checkbox">2<br>
<input value="3" type="checkbox">3<br>
<input value="4" type="checkbox">4<br>
<input value="5" type="checkbox">5<br>
<select class="inputbox" name="my_select[]"
 multiple="multiple" size="5">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</form>

От JavaScript я далекий человек ... Спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 13.04.2009, 07:00
Аватар для Riim
Рассеянный профессор
Отправить личное сообщение для Riim Посмотреть профиль Найти все сообщения от Riim
 
Регистрация: 06.04.2009
Сообщений: 2,379

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>blank</title>
	<script type="text/javascript">
var handleCheckboxClick = function(checkbox) {
	var option = document.getElementById('select1').options[checkbox.value - 1];
	option.selected = !option.selected;
};
	</script>
</head>
<body>
	<form id="form1" action="blank.html" method="post">
	<input value="1" type="checkbox" onclick="handleCheckboxClick(this);" />1<br />
	<input value="2" type="checkbox" onclick="handleCheckboxClick(this);" />2<br />
	<input value="3" type="checkbox" onclick="handleCheckboxClick(this);" />3<br />
	<input value="4" type="checkbox" onclick="handleCheckboxClick(this);" />4<br />
	<input value="5" type="checkbox" onclick="handleCheckboxClick(this);" />5<br />
	<select id="select1" multiple="multiple" size="5">
		<option value="1">1</option>
		<option value="2">2</option>
		<option value="3">3</option>
		<option value="4">4</option>
		<option value="5">5</option>
	</select>
	</form>
</body>
</html>
Ответить с цитированием
  #3 (permalink)  
Старый 13.04.2009, 08:17
Новичок на форуме
Отправить личное сообщение для DarkMaster13 Посмотреть профиль Найти все сообщения от DarkMaster13
 
Регистрация: 12.04.2009
Сообщений: 8

Спасибо Работает !!!
Ответить с цитированием
  #4 (permalink)  
Старый 14.04.2014, 03:04
Новичок на форуме
Отправить личное сообщение для terveg Посмотреть профиль Найти все сообщения от terveg
 
Регистрация: 15.11.2010
Сообщений: 3

а как тоже самое только на Jquery?
Ответить с цитированием
  #5 (permalink)  
Старый 14.04.2014, 03:30
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

terveg,

<!DOCTYPE HTML>
<html>
<head>
	<title>blank</title>
    <meta charset="utf-8">
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
    $(function () {
       $("#form1").on("click", "input:checkbox",function (event) {
           var $indx = $("input:checkbox").index(this);
           $indx++;
           $("#select1 option:nth-child("+$indx+")").prop({"selected" : this.checked});
       });
    })
  </script>
</head>
<body>
	<form id="form1" action="blank.html" method="post">
	<input value="1" type="checkbox"  />1<br />
	<input value="2" type="checkbox"  />2<br />
	<input value="3" type="checkbox"  />3<br />
	<input value="4" type="checkbox"  />4<br />
	<input value="5" type="checkbox"  />5<br />
	<select id="select1" multiple="multiple" size="5">
		<option value="1">1</option>
		<option value="2">2</option>
		<option value="3">3</option>
		<option value="4">4</option>
		<option value="5">5</option>
	</select>
	</form>
</body>
</html>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Выделение checkbox при условии атрибута... SashaBorandi jQuery 1 07.02.2009 14:18
раскрывать/скрывать <td> при выборе определенного элемента списка zip Элементы интерфейса 2 19.01.2009 13:58