Javascript для обновления текстового поля на основе ввода другого текстового поля

Я в основном хочу использовать javascript, чтобы иметь 2 текстовых поля, которые зависят друг от друга. Например, если я ввожу число x в текстовое поле 1, я хочу, чтобы textbox2 мгновенно обновлялся с помощью x * 2. Если я вводю x в текстовое поле2, я хочу, чтобы textbox1 автоматически обновлялся с помощью x/2. Эти значения всегда будут числами.Javascript для обновления текстового поля на основе ввода другого текстового поля

Редактировать: так вот мой html-файл. Может ли кто-нибудь дать мне подсказку, почему он не работает?

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <script type="text/javascript" src="scripts/jquery-1.7.2.js"></script> 
    <script type="text/javascript"> 
     $("#text1").keyup(function(){ 
      $("#text2").val($(this).val() * 2); 
     }); 
     $("#text2").keyup(function(){ 
      $("#text1").val($(this).val()/2); 
     });   
    </script> 
</head> 
<body> 
    <input type="text" name="text1" size=3 maxlength=6> 
    <input type="text" name="text2" size=3 maxlength=6> 
</body> 
</html>

источник

2012-05-10 Brian Yee

Звуки удивительным, дайте нам знать, как это оказывается. Если у вас есть вопросы, если при попытке/сбое отправьте сюда свой примерный код. – Madbreaks

Нечто похожее было задано здесь: http://stackoverflow.com/questions/2977428/jquery-mirror-one-text-input-to-another –

Нравится? http://jsfiddle.net/yKrJn/ –

Я не могу проверить точный код, что нужно для этого прямо сейчас, но основная идея заключается в том, чтобы положить событие OnKeyUp на каждом поле и изменить другие окна с помощью скрипта (с помощью getElementById или какой бы способ вы ни выбрали)

Я попытаюсь собрать код, когда смогу, если кто-то еще не доберется до него.

источник

2012-05-10 20:18:01

$("#textbox1").onkeyup(function() { 
    $("#textbox2").val($(this).val() * 2); 
}); 

$("#textbox2").onkeyup(function() { 
    $("#textbox1").val($(this).val()/2); 
});

источник

2012-05-10 20:19:45

Используйте событие onchange или обратный вызов изменения jquery для обновления других полей.

источник

2012-05-10 20:19:47 voscausa

В самом простом случае, это должно сделать это (fiddle here):

// in a <script>: 
window.update = function() { 
    var one = document.getElementById('one'), 
     two = document.getElementById('two');  

    two.value = parseInt(one.value) * 2; 
} 

<!-- in your HTML: --> 
<input id="one" type="text" onchange="update();" /> 
<input id="two" type="text" />

источник

2012-05-10 20:20:23 rjz

Если вы планируете сделать еще немного манипуляций с DOM, вы бы * намного лучше использовали фреймворк, такой как jQuery. – rjz

В данном случае, это следует сделать это: http://jsfiddle.net/du09jhpd/

window.update = function() { 
    var one = document.getElementById('one'), 
     two = document.getElementById('two');  

    two.value = parseInt(one.value) * 2; 
} 
window.update1 = function() { 
    var one = document.getElementById('one'), 
     two = document.getElementById('two');  

    one.value = parseInt(two.value)/2; 
}

источник

2017-11-03 02:57:41

Javascript для обновления текстового поля на основе ввода другого текстового поля

ответ

Смежные вопросы