Q&A
幾らでも考えられますが何がわからないのでしょうか。
jQueryで、アラートを出したいのですが、
html
1<body> 2 <input type="text" id="value"> 3 <input type="button" id="button" value="ボタン"> 4 5</body>
上記コードで指定したテキストボックスに入力した文言を、アラートに表示させる方法はありますか？
ちなみに、適応させたいコードの全体図はこちらです。
html
1<!DOCTYPE html> 2<html> 3<head> 4 <meta charset="UTF-8"> 5 <title>値の取得</title> 6 <link rel="stylesheet" type="text/css" href="base.css"> 7 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"> </script> 8 <script> 9 $(function(){ 10 // ここに処理を記述// 11 12 }); 13 </script> 14</head> 15<body> 16 <input type="text" id="value"> 17 <input type="button" id="button" value="ボタン"> 18 19</body> 20</html>
css
1@charset "UTF-8"; 2/* reset */ 3body, h1, h2, h3, h4, h5, h6, p, address, 4ul, ol, li, dl, dt, dd, img, form, table, tr, th, td { 5 margin: 0; 6 padding: 0; 7 border: none; 8 font-style: normal; 9 font-weight: normal; 10 font-size: 100%; 11 text-align: left; 12 list-style-type: none; 13 border-collapse: collapse; 14} 15 16textarea { font-size: 100%; vertical-align:middle;} 17img { border-style: none; display: block; } 18hr { display: none; } 19em{font-style: normal} 20input{line-height:auto;vertical-align:middle;} 21strong.more{color:#c30} 22a{text-decoration: none;} 23 24html { 25 26} 27 28body { 29 font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; 30} 31 32* { 33 -webkit-box-sizing: border-box; 34 -moz-box-sizing: border-box; 35 -o-box-sizing: border-box; 36 -ms-box-sizing: border-box; 37 box-sizing: border-box; 38} 39 40/* 上の部分は気にせずここから書く */ 41#wrapper { 42 display: flex; 43 justify-content: center; 44 height: 100vh; 45 align-items: center; 46} 47 48#button { 49 margin: 0 0px; 50 width: 55px; 51 height: 25px; 52 background-color: #f0f0f0; 53 cursor: pointer; 54} 55 56#button p { 57 line-height: 180px; 58 font-size: 30px; 59 text-align: center; 60} 61
jQueryにて表示させる場合の公文例などご教授頂きたいです。
指定した文言をアラートとして表示させる方法や変数を表示させる方法は調べてもよく出てくるのですが、文言を指定しない、テキストボックスに入力した文言を表示させる、とした場合どう応用したものか、と悩んでいます。宜しくお願いいたします。
jQueryを使用せずともアラートを表示できますが、
「jQueryで」という指定は、どのような意図があるのでしょうか。
jQueryで動的にイベントを追加してJavascript標準のalertでメッセージを出力すればよいのか、
それとも（無いとは思いますが）jQueryUI等を使用してリッチなメッセージを出したいのですか？
単に勉強中なもので。(笑)
勉強中、はいいとして肝心のコードを全く書いてないのは如何なものかと。失敗して覚えることのほうが多いですよ。
素の状態の方がわかりやすいかと思い、まっさらな状態で掲載しておりました。ありがとうございます。
それ以前に「丸投げ」です。
約1か月何も音沙汰ないまま急に「解決」とされましたが、どうなったのでしょう。
https://teratail.com/help/question-tips#questionTips4-2
回答1件
0
ベストアンサー
alertがwindow.alertなのか、jQueryUI Dialogなのかで多少実装は変わるけどロジックは同じ。
結局固定か可変かの違いで、出力したい文字列を得れば良い。
- ボタン押下のイベント捕捉（いやadd/onだから「付与」が正しいか）
- テキストボックスのvalue取得
- 2.をalertの引数に
window.alertのほうならjQueryである必要はないですね。
投稿2021/02/08 07:22
編集2021/02/08 07:26総合スコア80875
イベント捕捉
value取得（プロパティ）
はJavaScriptの基礎です。
調べて出てこない情報ではありません。
個人的にはjQueryUIよりモーダルのほうが見た目はリッチで、レスポンシブもしやすいと思う。
ありがとうございます。取り組んでみます。
他者からは「ほとんど取り組んでない」と見られていることは認識されますよう。
あなたの回答
tips
プレビュー
