javascript - テキストフィールド JavaScript のテキストをクリアする

Question

たとえば、 Gmailアカウントのサインアップに行くと、テキストフィールドのテキスト をクリアしたい入力を開始するとテキストがクリアされることがわかります。とても簡単です

document.getElementById("FirstName").value = "";うまくいきません、言葉Firstはまだそこにあります。

ではどうやってクリアするのでしょうか？ありがとうございました。

Answer 1

HTML を詳しく見てみましょう。文字列Firstはテキスト ボックスの値ではなく、CSS を介してその上に配置される SPAN です。

<label id="firstname-label" class="firstname">
  <strong>First name</strong>
  <input id="FirstName" type="text" spellcheck="false" name="FirstName" value="" n="1">
  <span id="firstname-placeholder" class="placeholder-text" style="display: block;">First</span>
</label>

この手法は、透かしと呼ばれることもあります。

値を変更してSPANを非表示にする方法について

入力に値があるとすぐに (keyUp イベントにバインドされているように見えます)、このインライン スタイルが span に追加されますdisplay: none;。プログラムでスパンを設定input#FirstNameおよびクリアしたい場合は、非表示をトリガーしているイベントをプログラムで起動するか、プログラムでスパンを非表示にする必要があります (プレースホルダー値を持つ各入力が ID を使用しているように見える<input ID>-placeholderので、正しい値を推測できます)設定している入力の ID に基づくスパン)