如何在輸入更改時動態更改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的內容？

回答

相關問題