2017-09-01 3 views
1

テキスト入力ボックスから入力を取得して、段落を入力ボックスの内容に変換しようとしています。これは、ブラウザで実行されるコードだけのWebページではありません。テキストボックスから入力を取り込んでテキストを変更する方法

<!DOCTYPE html> 
<html> 
<form><center> 
First name:<br> 
    <input type="text" name="Firstname" id="JohnnyFunc"></form> 
    <button type="button" onclick="myFunction">Submit</button> 
<script> 
    function myFunction() 
{ 
document.getElementById("JhonnyOutput"). innerHTML="JohnnyFunc" 
} 
</script> 
<center><p>Hello</p><p id="JhonnyOutput">Johhny!</p></center> 
</html> 

答えて

1

のonclick属性は、関数名の後の括弧を含める必要があります:あなたは、あなたの最初の<center>要素

の終了タグが欠落していた onclick="myFunction()"

<form> 
    <center>First name:<br><input type="text" name="Firstname" id="JohnnyFunc"></center> 
</form> 
<center><button type="button" onclick="myFunction()">Submit</button></center> 
<script> 
    function myFunction() 
    { 
     document.getElementById("JhonnyOutput"). innerHTML="JohnnyFunc" 
    } 
</script> 
<center><p>Hello</p><p id="JhonnyOutput">Johhny!</p></center> 

ここ は、私がこれまで持っているものです

テキストをテキストボックスに変更するには、入力要素のテキストを取得する必要があります。

function myFunction() { 
    var newText = document.getElementById("JohnnyFunc").value 
    document.getElementById("JhonnyOutput").innerHTML = newText 
} 
+0

私はおそらくあなたがしたすべてを追加したので、ここで何か間違っているでしょう、それは動作しません。 Submitボタンを押すと、「Johnny!」のテキストが変わります。 "JohnnyFunc"へ。どうして?私はあまりにもええコーディングにはあまり経験がありません。 – DiamondMiner88

+0

申し訳ありませんが、テキストボックスから段落にテキストを取得するために、myFunction()に2番目のコードブロックを代入する必要があることを明確にしていないと思います。ここでは、実用的な[JSFiddle](https://jsfiddle.net/ou0tLyx4/1/)を紹介します –

関連する問題