-1

ユーザー入力後に表示され続けるプレテキストを含むテキストフィールドを作成する方法

私は例えばのようなテキストフィールドを作成しようとしています

[                      yourdomain.com]

次に、ユーザータイプ yourdomain.com が消えない場合、そこに表示されますが、これも削除できません。削除できないことを意味します。バックグラウンドでそこにとどまる

[            myaccount.yourdomain.com]
4

2 に答える 2

2

どうぞ：

HTML:

<input class=actual><input class=show value='.yourdomain.com' readonly>

CSS:

input.actual {
  text-align: right;
  border-right-width: 0;
}

input.show {
  border-left-width: 0;
}

「実際の」ものは実際の入力フィールドなので、名前なども付けます。

これがデモです。

于 2013-10-10T15:57:11.123 に答える
0

HTML 入力フィールドには、2 種類の値しかありません。最初のものは、(編集可能な) コンテンツをフィールドに入れる「値」パラメータです。2 番目のパラメーターは「プレースホルダー」で、ユーザーが入力を開始すると消える入力フィールドに「説明」を入れます。

<input type="text" value="@yourdomain.com" name="email">

また

<input type="text" placeholder="Your email address: such as me@yourdomain.com">

「サフィックス」を表示および非表示にする場合は、JavaScript を使用する必要があります。次のように、最初の入力例の内容にアクセスできます。

document.getElementByName("email").value

ユーザーが入力を開始または停止したかどうかを確認するには、フォーカス イベント (OnFocus) と (OnBlur) を使用します。したがって、たとえば、次のことを試みることができます。

<input type="text" value="@yourdomain.com" onfocus="this.value=''" onblur="this.value+='@yourdomain.com'">

私はそれをテストしていませんが、これがこの問題を解決する正しい方法だと思います。

ただし、最初の 2 つの例のいずれかを使用することを検討してください。ユーザーがフィールドをクリックしてコンテンツが消えた場合、「@domain.com」の部分を自分で入力すると、フィールドの値は「me@domain.com@yourdomain.com」のようなものになります。これはユーザーを混乱させる可能性があります。

于 2013-10-10T16:04:15.023 に答える