Javascript.RU

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

Помогите с radio button. Не стандартное решение
Всем добрый день и с праздником.
я начал изучение JavaScript и у меня стоит такая задача:
Есть код формы в котором есть 2 radio button с разными именами (1. name="R1" и 2. name="R2")
задача стоит сделать чтоб была возможность отметить только одну R1 или R2. причем не меняя имени "name". Сделать нужно с помощью javascript.

Собстно код:

...
<tr>
<td width="150" align="right">
<sup>*</sup>
</td>
<td width="30">
<input type="radio" name="R1" value="one"> </td>
<td width="30">One</td>
<td width="30">
<input type="radio" name="R2" value="two"> </td>
<td width="30">Two</td>
</tr>


Помогите пожалуйста, 3 дня мучаюсь уже, не знаю как сделать.
Ответить с цитированием
  #2 (permalink)  
Старый 01.05.2010, 12:56
Аватар для subzey
Пионэр
Отправить личное сообщение для subzey Посмотреть профиль Найти все сообщения от subzey
 
Регистрация: 16.11.2009
Сообщений: 1,322

Что-то Вы не так делаете, раз Вам это нужно.

Сделать в яваскрипте что-то противоестесственное браузеру не достижение. Достижение — сделать так, чтобы браузер выполнял за Вас 90% работы.
Ответить с цитированием
  #3 (permalink)  
Старый 01.05.2010, 13:07
Новичок на форуме
Отправить личное сообщение для dreckin Посмотреть профиль Найти все сообщения от dreckin
 
Регистрация: 01.05.2010
Сообщений: 7

Я бы с удовольствием просто поменял name в обоих radio button на R1 и не парился.

Но такое у меня задание:
С каким синтаксисом Вы можете обратиться к обеим радио-кнопкам (One и Two) на HTML-странице?
Ответить с цитированием
  #4 (permalink)  
Старый 01.05.2010, 13:22
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

var a = document.forms[0]; // 0 — номер формы, в которой кнопки находятся
a.R1.param = a.R2.param = value;
Ответить с цитированием
  #5 (permalink)  
Старый 01.05.2010, 13:24
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 09.07.2008
Сообщений: 3,873

<fieldset>
	<div>
		<input type="radio" id="R1" name="R1" />
		<label for="R1">One</label>
	</div>
	<div>
		<input type="radio" id="R2" name="R2" />
		<label for="R2">Two</label>
	</div>
</fieldset>
<script type="text/javascript">
(function () {
	var R1 = document.getElementsByName("R1")[0], R2 = document.getElementsByName("R2")[0];
	R1.onclick = R2.onclick = function () {
		var other = this == R1 ? R2 : R1;
		if (this.checked) {
			other.checked = false;
		}
	};
})();
</script>
Но лучше поставить name="R[]" и обрабатывать результат на сервере, иначе пользователи без JavaScript (Да, такие есть!) не смогут корректно заполнить вашу форму.

Последний раз редактировалось Octane, 01.05.2010 в 13:33.
Ответить с цитированием
  #6 (permalink)  
Старый 01.05.2010, 13:35
Новичок на форуме
Отправить личное сообщение для dreckin Посмотреть профиль Найти все сообщения от dreckin
 
Регистрация: 01.05.2010
Сообщений: 7

Огромное спасибо, щас попробую.
Ответить с цитированием
  #7 (permalink)  
Старый 01.05.2010, 13:41
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 03.04.2008
Сообщений: 6,233

на крайняк, чтобы сохранить смысл учебного задания(я правильно понял?), задайте им имена R[1] и R[2]
Ответить с цитированием
  #8 (permalink)  
Старый 01.05.2010, 16:37
Новичок на форуме
Отправить личное сообщение для dreckin Посмотреть профиль Найти все сообщения от dreckin
 
Регистрация: 01.05.2010
Сообщений: 7

Сообщение от Octane Посмотреть сообщение
<script type="text/javascript">
(function () {
	var R1 = document.getElementsByName("R1")[0], R2 = document.getElementsByName("R2")[0];
	R1.onclick = R2.onclick = function () {
		var other = this == R1 ? R2 : R1;
		if (this.checked) {
			other.checked = false;
		}
	};
})();
</script>
Спасибо за помощь.
Я так понимаю работает этот скрипт только после кода кнопок? т.е. в head его не вставить?

Последний раз редактировалось dreckin, 01.05.2010 в 17:23.
Ответить с цитированием
  #9 (permalink)  
Старый 01.05.2010, 16:50
Аватар для Gvozd
Матрос
Отправить личное сообщение для Gvozd Посмотреть профиль Найти все сообщения от Gvozd
 
Регистрация: 03.04.2008
Сообщений: 6,233

можете повесить его на window.onload, или на событие доступности DOM
Ответить с цитированием
  #10 (permalink)  
Старый 01.05.2010, 16:53
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 09.07.2008
Сообщений: 3,873

Если его вставить в <head> в таком виде, как сейчас, то метод getElementsByName будет возвращать пустой массив, так как на момент выполнения скрипта, нужные элементы еще не успеют подгрузиться. Можно запустить по событию DOMContentLoaded (гуглите его кросс-браузерную реализацию) или window.onload, если так хочется в <head> засунуть скрипт. Но проще просто перед </body> располагать все скрипты.

------
не успел)
Ответить с цитированием
Ответ



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

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