ホーム

htmlのformからjavascriptへ文字を渡してhtmlのtableに表示する

0
0

html

htmlでフォームとテーブルを作成し、フォームの値(text)をjavascriptへ渡してhtmlでtableに返します。

スクリーンショット 2017-04-03 13.28.57.png

スクリーンショット 2017-04-03 13.28.21.png

form

<form name = "form">
<input type="text" name="txtb" id="textid">
<input type="button" value="君に決めた!" onclick="tbox1()">
</form>

table

<!-- テーブル実装 -->
    <table class = "Table">
      <tbody>
        <tr>
            <th scope="row">項目名</th>
            <td> <div id="textoutput"></div> </td>
        </tr>
    </tbody>
        </table>

Javascript

script

//textboxの文字を取得する
function tbox1(){

str1 = document.form.txtb.value;

console.log(str1);


var x = document.getElementById('textid').value;
  numx = parseInt(x);
  numx = numx + 1;
  document.getElementById('textoutput').innerHTML = x;

};

参考

formからjavascriptへ値を渡してhtmlで表示する

Pocket
LinkedIn にシェア

りょすけ
毎月3万人以上のプログラマーが訪れるoff.tokyoで、プログラマーさん向けのアンケートを実施しています、アンケートに無料回答すると、他の人の投票も見ることが出来ます!

学びたいプログラミング言語は何ですか?

 vaaaval@gmail.com



  • この記事を書いた人
  • 最新記事

藤沢瞭介(Ryosuke Hujisawa)

りょすけと申します。18歳からプログラミングをはじめ、今はフロントエンドでReactを書いたり、AIの勉強を頑張っています。off.tokyoでは、ハイテクやガジェット、それからプログラミングに関する情報まで、エンジニアに役立つ情報を日々発信しています!

-ホーム

Copyright© off.tokyo , 2021 All Rights Reserved Powered by AFFINGER5.