2016-03-02 66 views
2

如何在輸入字段上寫入任何我寫的h1?JS複製輸入的值

事情是這樣的:

<input id="inputtxt" type="text" value="Insert text here.."> 
<h1 id="newtxt"></h1> 

<script> 
var txtelement 

txtelement = document.getElementById("inputtxt").value; 
document.getElementById("newtxt").innerHTML=txtelement; 

</script> 

它複製頁面加載時,但不是我寫

+0

使得它的功能,並調用它在頁面加載後編輯/ s到通過的onkeyup領域 – npup

回答

1

你可以使用.oninput事件:

document.getElementById("inputtxt").oninput = function(e){ 
    document.getElementById("newtxt").innerHTML=e.target.value; 
}; 

注意:您可以使用佔位符而不是value來向輸入字段中的用戶顯示默認味精。

希望這會有所幫助。


document.getElementById("inputtxt").oninput = function(e){ 
 
    document.getElementById("newtxt").innerHTML=e.target.value; 
 
};
<input id="inputtxt" type="text" placeholder="Insert text here.."> 
 
<h1 id="newtxt"></h1>

+1

變化onkeypress事件。 onkeypress,只在第二次更換時才更改,而不是在進入char之後。 – Alexis

0

當一個事件發生的電平變化一樣,的onclick,你可以寫一個JavaScript函數,然後調用這個函數等

例子:

HTML

<input id="inputtxt" type="text" value="Insert text here.." onkeyup="updateText()" /> 
<h1 id="newtxt"></h1> 

的JavaScript

var txtelement 
var h1 = document.getElementById("newtxt"); 
var input = document.getElementById("inputtxt"); 
function updateText() { 
    txtelement = input.value; 
    h1.innerHTML=txtelement; 
} 

你可以看到它在這方面的工作JS小提琴:https://jsfiddle.net/igor_9000/e82jahq2/

希望幫助!

0

您可以添加onkeyup事件:

var txtelement; 
 
var input = document.getElementById("inputtxt"); 
 
var newtxt = document.getElementById("newtxt"); 
 
input.onkeyup = function() { 
 
    txtelement = input.value; 
 
    newtxt.innerHTML=txtelement; 
 
}; 
 
input.onkeyup()
<input id="inputtxt" type="text" value="Insert text here.."> 
 
<h1 id="newtxt"></h1>