最終更新日:2020/05/19
テキストエリアについてのメモ
テキストエリア内に文字を表示させる方法のメモ。リンク用のタグを書くなら
value(1と2)
を、ただ表示させたいだけのときは
placeholder(3)
を使ったほうがいいのかなと思ったというメモ。
コピーボックス、リンクタグ向き
1.基本の形
基本は「<input type="text" value="表示させたい文字">」で表示される。このテキストエリア内で書いたり消したり、コピペもできる。しかし拍手やメールボックス等には不向き(入力するとき文字を消す作業が必要なため)。
1-1.HTML(リンク用のタグ)を表示させたい
このように表示させるには
<と>、"を使う
。
「<」は
&lt;
、「>」は
&gt;
、そして「”」は
&quot;
と記述することで表示できる。難しい。
(例)
&lt;a href=&quot;url&quot;&gt; リンク文字 &lt;/a&gt;
※このページでは表示を優先して&を全角にしてあります。使用する際は全て半角でないと正しく表示されません。
2.ワンタップで全選択
テキストエリア内をクリックまたはタップするだけで全選択される記述、めっちゃ便利だと思った。リンクタグ用におすすめです。基本形に「onclick="this.select();"」を追加するだけ。易しい。
<input type="text" value="ワンタップ選択文字" onclick="this.select();">
拍手やメール等に向いている
3.文字を表示するだけ
valueではなくplaceholderを使う。
書いたり消したり、選択、コピーが
できない
。表示するだけ。拍手やメールボックスに表示させたい文字があるときに向いていると思う。
<input type="text" value="" placeholder="表示だけさせたい" >
TOP