如何在输入更改时动态更改div的内容？

<input type="text" class="input-text qty" title="Qty" value="1" maxlength="12" id="qty" name="qty" /> 
<div id="qtyvalue"><div>

页面上有一个输入文本框。我正在使用Javascript将qtyvalue输出到下面的div。如何在输入更改时动态更改div的内容？

var qty =document.getElementById('qty').value; 
document.getElementById('qtyvalue').innerHTML = qty;

现在，如果用户在文本框中输入一个数字，qtyvalue的价值也会相应改变，我不需要刷新页面。我应该如何更改代码？

来源

2012-11-18 123

将代码分配给输入字段的'.onchange'财产的事件处理程序？ –

或者'keyup'事件直接在键入时作出反应。（就像在计算器下面的计算器下面的计数器一样。） – clentfort

我编辑了标题，以便更清楚地询问问题。 – user123444555621

总结这里面keyup事件：

var input = document.getElementById('qty'); 
input.onkeyup = function() { 
    document.getElementById('qtyvalue').innerHTML = input.value;  
}

但是，你应该考虑增加对其他事件也同样的动作：change，paste，input。

工作实例here

来源

2012-11-18 10:34:38 Inferpse

为那些不熟悉基本事件处理的人增加了一个答案。 – Inferpse

Inferpse，如果我想使用改变，如何改变代码，谢谢 – 123

您使用'keyup'事件的相同方式 - 'input.onchange = function（）{...' – Inferpse

<input type="text" onchange="javascript:callMeOnChange()" class="input-text qty" title="Qty" value="1" maxlength="12" id="qty" name="qty" /> 
<div id="qtyvalue"><div> 
<script> 
function callMeOnChange() 
{ 
$('#qtyvalue').value=$('#qty').val(); 
} 
</script>

来源

2012-11-18 13:17:58

更改按钮状态的输入字段内容变化

<script type="text/javascript"> 
     $('#submit').attr('disabled',true);// 
     $('#captchaStatusTrue').attr('hidden',true);// 
     $('#captchaStatusFalse').removeAttr('hidden');// 

     document.getElementById("status").onchange = function(){ 
     var status = document.getElementById("status").value; 
     var falses = "false"; 

     if(status == falses){// 
       $('#submit').attr('disabled',true);// 
       $('#captchaStatusTrue').attr('hidden',true);// 
       $('#captchaStatusFalse').removeAttr('hidden');// 
      } 
      else{// 
        $('#submit').removeAttr('disabled');// 
        $('#captchaStatusFalse').attr('hidden',true);// 
        $('#captchaStatusTrue').removeAttr('hidden');// 

      }// 
     };// 
    </script>

来源

2016-10-04 13:52:38 NikolaP

如何在输入更改时动态更改div的内容？

回答

相关问题