jQuery keyupメソッドを使ってフォームに入力された値を表示するサンプル
環境
Google Chrome 105.0.5195.127
Windows 10 Home 64bit
jquery 3.6.1
構文
$('セレクターID名).on('keyup’, function () {処理コード}
keyupメソッドを使用してフォームに入力された値を表示します。
使用例
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script> <script> $(document).ready(function(){ //フォームに入力された値を表示 $('#name').on('keyup', function () { $('#res').text( $(this).val() ) }) }); </script> </head> <body> <h2 id="res"></h2> <input id="name" type="text"> </body> </html>
実行結果
テキストフォームに「study」入力を行うと、入力した文字を表示します。