Javascript-форум (https://javascript.ru/forum/)
-   Internet Explorer (https://javascript.ru/forum/css-html-internet-explorer/)
-   -   Код работает правильно на всех основных браузерах, кроме IE (https://javascript.ru/forum/css-html-internet-explorer/5562-kod-rabotaet-pravilno-na-vsekh-osnovnykh-brauzerakh-krome-ie.html)

AquaForm 23.10.2009 11:46

Код работает правильно на всех основных браузерах, кроме IE
 
Делаю тест. Суть теста в том, что на два ответа есть 3 очка, которые можно распределить между двумя вариантами. Выбор пользователь делает с помощью чекбоксов. Под каждым вариантом ответа есть своя группа чекбоксов с возможными вариантами ответа - 0,1,2,3.

Ну и хотел сделать так, чтобы если пользователь выбирает чекбокс одного варианта, то с помощью JavaScript выбирался чекбокс второго.

Во всех браузерах(Chrome, Opera, FireFox) работает как и задумал, а вот IE делает все как-то по своему.

Опыта в JavaScripte очень мало и даже не знаю куда копать.
В чем подвох? Что не правильно делаю?

Вот странички:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> 
 
<title>Мотивация</title> 
<link href="style.css" rel="stylesheet" type="text/css"> 
 
</head> 
<body> 
<div id= 'container'> 
<div class="brd_grad"> 
 
<p>Вопрос: 1 из 84.</p> 
 
<form action='motivation.php' method='post' name='motivation_test'><input name="global_i" type="hidden" value="1"> 
 
<input name="global_W" type="hidden" value="0"> 
<input name="global_A" type="hidden" value="0"> 
<input name="global_P" type="hidden" value="0"> 
<input name="global_E" type="hidden" value="0"> 
<input name="global_O" type="hidden" value="0"> 
<input name="global_B" type="hidden" value="0"> 
<input name="global_S" type="hidden" value="0"> 
 
    <table width="690" border="1"> 
      <tr> 
        <td width="345" align="center">Консультант по вопросам бизнеса</td> 
        <td align="center">Репортер</td> 
      </tr> 
      <tr> 
        <td> 
        	<input id="B" name="B" type="text" value="-" readonly="true"><br> 
          <p> 
              <label> 
                <input type="radio"  name="RadioGroup1" value="3" id="first3" onChange="select_first(3);"> 
                3</label> 
              <br> 
              <label> 
                <input type="radio" name="RadioGroup1" value="2" id="first2" onChange="select_first(2);"> 
                2</label> 
              <br> 
              <label> 
                <input type="radio" name="RadioGroup1" value="1" id="first1" onChange="select_first(1);"> 
                1</label> 
              <br> 
              <label> 
                <input type="radio" name="RadioGroup1" value="0" id="first0" onChange="select_first(0);"> 
                0</label> 
              <br> 
        </p></td> 
        <td> 
            <input  id="W" name="W" type="text" value="-" readonly="true"><br> 
          <p> 
              <label> 
                <input type="radio" id="second3" name="RadioGroup2" value="3" onChange="select_second(3)"> 
                3</label> 
              <br> 
              <label> 
                <input type="radio" id="second2" name="RadioGroup2" value="2" onChange="select_second(2)"> 
                2</label> 
              <br> 
              <label> 
                <input type="radio" id="second1" name="RadioGroup2" value="1" onChange="select_second(1)" > 
                1</label> 
              <br> 
              <label> 
                <input type="radio" id="second0" name="RadioGroup2" value="0" onChange="select_second(0)"> 
                0</label> 
              <br> 
        </p></td>        
      </tr> 
      <tr> 
      	<td colspan="2"> 
        	<input id="knopka" name="common" type="submit" value="Далее" disabled>        
            
        </td> 
      </tr> 
    </table> 
</form> 
</div> 
</div> 
 
</body> 
 
<script> 
function select_first(x)
{
	document.getElementById("knopka").disabled = false;
	switch (x)
	{
		case 3:
			document.getElementById("second0").checked = true;
			document.getElementById("B").value = x;
			document.getElementById("W").value = 3-x;
			
		break;
		
		case 2:
			document.getElementById("second1").checked = true;
			document.getElementById("B").value = x;
			document.getElementById("W").value = 3-x;
		break;
		
		case 1:
			document.getElementById("second2").checked = true;
			document.getElementById("B").value = x;
			document.getElementById("W").value = 3-x;
		break;
		
		case 0:
			document.getElementById("second3").checked = true;
			document.getElementById("B").value = x;
			document.getElementById("W").value = 3-x;
		break;
	}
}
 
function select_second(x)
{
	document.getElementById("knopka").disabled = false;
	switch (x)
	{
		case 3:
			document.getElementById("first0").checked = true;
			document.getElementById("W").value = x;
			document.getElementById("B").value = 3-x;
			
		break;
		
		case 2:
			document.getElementById("first1").checked = true;
			document.getElementById("W").value = x;
			document.getElementById("B").value = 3-x;
		break;
		
		case 1:
			document.getElementById("first2").checked = true;
			document.getElementById("W").value = x;
			document.getElementById("B").value = 3-x;
		break;
		
		case 0:
			document.getElementById("first3").checked = true;
			document.getElementById("W").value = x;
			document.getElementById("B").value = 3-x;
		break;
	}
}
</script> 
 
</html>


Заранее спасибо :)

AquaForm 23.10.2009 13:40

Ура! "Ошибка" найдена
 
Ошибка найдена.

В IE для чекбоксов используйте событие onClick, а не onChange

x-yuri 24.10.2009 03:30

в ie onchange срабатывает, когда input type="checkbox" теряет фокус

Цитата:

Сообщение от AquaForm
В IE для чекбоксов используйте событие onClick, а не onChange

а в остальных браузерах?

Flounder 16.11.2009 01:40

Цитата:

Сообщение от AquaForm (Сообщение 33282)
Ошибка найдена.

В IE для чекбоксов используйте событие onClick, а не onChange

глупость использовать данное событие. А если я чисто с клавиатуры табом и пробелом чекбокс выставлю? А?

Использовать логично только onChange!!!! Если требуется незамедлительная реакция на "галочку" - добавьте onClick + onKeyPress.
но самые важные действия должны быть связаны только с onChange!!!

Octane 16.11.2009 02:10

Цитата:

Сообщение от Flounder
глупость использовать данное событие. А если я чисто с клавиатуры табом и пробелом чекбокс выставлю? А?

А проверить прежде чем писать? А?

Flounder 24.11.2009 19:43

а что проверять то? я что-то не правильно сказал?
Просто сам писал кучу подобных обработчиков. В том числе для локальных приложений где все действия с клавы оператор выполняет. И онклик там будет создавать кучу проблем.
В любом случае еще нужна пост-проверка на blur. Желательно. Фокус и статус on off могут терятся по куче внешних факторов. А человеческая моторика этому противится - от этого ошибки. Проверено в т.ч. и на бабушках :)

Octane 24.11.2009 20:16

Цитата:

Сообщение от Flounder
а что проверять то?

Как и для button, для checkbox событие onclick срабатывает по нажатию пробела.

Flounder 24.11.2009 21:44

Ё-мое. И правда. Вот бред. Я такой нелепости даже представить не мог. Ну у мну и без онклика всё работает. И вам всем советую не вешать на онклик если нужен ончейнж. Всётаки логика нарушается, да и код сопровождать легче.

ЗЫ: ППЦ, пойду покурю, успокоюсь. Только отошел от идиотизма в Опере, так тут на тебе... И чо? Это во всех браузера такой онкликОончэйнж на чекбоксы? Про баттон то знал, да и логично, а тут бред... ну ппц...

Octane 24.11.2009 22:07

Цитата:

Сообщение от Flounder
Это во всех браузера такой онкликОончэйнж на чекбоксы?

Вроде да, только порядок возникновения onchange и onclick разный.

x-yuri 24.11.2009 22:55

вообще да, я бы скорее скрыл эту особенность. Попробовал бы по-крайней мере. Естественно подразумевается какой-то промежуточный слой между реализациями браузеров и кодом, реализующим требуемую функциональность


Часовой пояс GMT +3, время: 07:43.