Необходима реализация связи между полями ввода

@Westbro0k · Регистрация: 08.03.2013

Author24 — интернет-сервис помощи студентам

Всем доброго времени суток.

Я не силён в HTML, по этому прошу вашей помощи.

Имеется 2 поля <input>

HTML5

1 2	<input type="text" name="cost"/> <input type="text" name="coll"/>

Задача заключается в следующем: Как реализовать, что бы при вводе в <input> с именем cost, <input>-у с именем coll присваивалось значение введенное нами умноженное на 10, а так же что бы при вводе в <input> с именем coll, <input>-у с именем cost присваивалось введенное значение деленное на 10.

Заранее благодарен за любую помощь.

@leonP4 · 08.03.2013, 14:14

HTML5

<input id="1" type="text" name="cost"/>
<input type="submit" class="1" value="ок"/>
 
<input id="2" type="text" name="coll"/>
<input type="submit" class="2" value="ок"/>

Javascript

 $('#1').keypress(function(eventObject){
   $('.1').click(function(){
     var val = $('#1').attr("value");
     $("#2").attr("value", val*10);
   });
});
 $('#2').keypress(function(eventObject){
   $('.2').click(function(){
     var val2 = $('#2').attr("value");
     $("#1").attr("value", val2/10);
   });
});

Если вас правильно понял, то вот рабочий код.

@Westbro0k · 08.03.2013, 14:59 **[ТС]**

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

HTML5

<input id="1" type="text" name="cost"/>
<input type="submit" class="1" value="ок"/>
 
<input id="2" type="text" name="coll"/>
<input type="submit" class="2" value="ок"/>

Javascript

 $('#1').keypress(function(eventObject){
   $('.1').click(function(){
     var val = $('#1').attr("value");
     $("#2").attr("value", val*10);
   });
});
 $('#2').keypress(function(eventObject){
   $('.2').click(function(){
     var val2 = $('#2').attr("value");
     $("#1").attr("value", val2/10);
   });
});

Если вас правильно понял, то вот рабочий код.

Разместил JS в <head> в теге <script>, HTML разместил в теле, при нажатии на кнопки реакции 0

Возможно я что то не правильно вставил?
И да, на сколько я понимаю, действие будет выполнено только после нажатия кнопки подтверждения, а нужно автоматически обновлять при вводе значений. Подскажите пожалуйста как это правильно реализовать/подключить. Ещё раз заранее очень благодарен.

@leonP4 · 08.03.2013, 15:02

Westbro0k, Извините, забыл сказать - написал я на jquery, по этому надо подключить библиотеку в <head>, тогда код работать будет.

Хорошо, сейчас переделаю

@Westbro0k · 08.03.2013, 15:05 **[ТС]**

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

Westbro0k, Извините, забыл сказать - написал я на jquery, по этому надо подключить библиотеку в <head>, тогда код работать будет.

Хорошо, сейчас переделаю

Буду очень вам благодарен.

@leonP4 · 08.03.2013, 15:31

Не стал заморачиваться на jquery, вот элементарно на js, обрабатывает сразу без кнопок.

HTML5

1
2
3

<input id="1" value="" onKeyUp="javascript:document.getElementById('2').value = this.value * 10;" type="text" name="cost"/>
     
    <input id="2" value="" onKeyUp="javascript:document.getElementById('1').value = this.value / 10;" type="text" name="cost"/>

@Westbro0k · 08.03.2013, 15:37 **[ТС]**

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

Не стал заморачиваться на jquery, вот элементарно на js, обрабатывает сразу без кнопок.

HTML5

1
2
3

<input id="1" value="" onKeyUp="javascript:document.getElementById('2').value = this.value * 10;" type="text" name="cost"/>
     
    <input id="2" value="" onKeyUp="javascript:document.getElementById('1').value = this.value / 10;" type="text" name="cost"/>

Огромное вам спасибо, работает так как нужно))

@leonP4 4 / 1 / 2 Регистрация: 08.03.2013 Сообщений: 65
	08.03.2013, 15:02	4
	Westbro0k, Извините, забыл сказать - написал я на jquery, по этому надо подключить библиотеку в <head>, тогда код работать будет. Хорошо, сейчас переделаю 0

@Westbro0k 0 / 0 / 0 Регистрация: 08.03.2013 Сообщений: 4
	08.03.2013, 15:05 [ТС]	5
	Сообщение от leonP4 Westbro0k, Извините, забыл сказать - написал я на jquery, по этому надо подключить библиотеку в <head>, тогда код работать будет. Хорошо, сейчас переделаю Буду очень вам благодарен. 0

	08.03.2013, 15:37

Опции темы