HTMLのINPUTタグにおいて、type="password"としたときの伏せ文字(●とか)を変更することは可能でしょうか?

回答の条件
  • 1人2回まで
  • 登録:2010/02/11 17:46:18
  • 終了:2010/02/12 12:16:02

ベストアンサー

id:ardarim No.3

ardarim回答回数897ベストアンサー獲得回数1452010/02/11 23:36:03

ポイント60pt

標準のHTMLとCSSでは仕組み上無理です。


JavaScriptが必要になりますが、dpasswordライブラリを使ってこういう解決法もあります。

iPhone-like password fields using jQuery // DECAF° blog fur digitale kommunikation

jQueryを使ったパスワードの置き換えです。JavaScriptが無効な場合は透過的な動作(通常のパスワードの動作('*'表示))になります。

・任意のUnicode文字に置き換え可能

・時間を指定して文字を隠すことが可能(入力直後は見せる)


サンプル(マスク文字を「秘」に置き換えています)


ただし、順番に入力した場合のみ有効(最後の文字だけ。途中の文字の編集不可)、duration=0にしても一瞬入力文字が見えてしまう等の制限があります。

その他の回答(4件)

id:km1967 No.1

km1967回答回数541ベストアンサー獲得回数402010/02/11 18:57:41

できません

id:memamii

この質問・回答へのコメントにana_logさんが書いているのをご覧になってから、回答してますよね?

2010/02/11 19:10:36
id:e55ind No.2

e55ind回答回数162ベストアンサー獲得回数42010/02/11 19:03:24

不可能です。

id:memamii

この質問・回答へのコメントにana_logさんが書いているのをご覧になってから、回答してますよね?

2010/02/11 19:10:43
id:ardarim No.3

ardarim回答回数897ベストアンサー獲得回数1452010/02/11 23:36:03ここでベストアンサー

ポイント60pt

標準のHTMLとCSSでは仕組み上無理です。


JavaScriptが必要になりますが、dpasswordライブラリを使ってこういう解決法もあります。

iPhone-like password fields using jQuery // DECAF° blog fur digitale kommunikation

jQueryを使ったパスワードの置き換えです。JavaScriptが無効な場合は透過的な動作(通常のパスワードの動作('*'表示))になります。

・任意のUnicode文字に置き換え可能

・時間を指定して文字を隠すことが可能(入力直後は見せる)


サンプル(マスク文字を「秘」に置き換えています)


ただし、順番に入力した場合のみ有効(最後の文字だけ。途中の文字の編集不可)、duration=0にしても一瞬入力文字が見えてしまう等の制限があります。

id:nekochokin No.4

nekochokin回答回数1ベストアンサー獲得回数02010/02/11 23:53:48

ポイント30pt

type="password" というのが絶対条件なのであれば、できません。

が、type="text"でも良いのであれば、無理やり再現することは可能です。

以下にサンプルプログラムを書きます。

<html lang="ja">

<head>

<script type="text/javascript"><!ーー</p> <p>function passinput(){</p> <p> document.aaa.pass.value = document.aaa.pass.value + document.aaa._pass.value.substr(document.aaa._pass.value.length-1,document.aaa._pass.value.length);</p> <p> document.aaa._pass.value = "";</p> <p> var x = document.aaa.pass.value.length;</p> <p> while(x){</p> <p> document.aaa._pass.value = document.aaa._pass.value + "*";</p> <p> x--;</p> <p> }</p> <p>}</p> <p>//ーー></script>

</head>

<body>

<form name="aaa" onsubmit="return false">

<input type="text" name="_pass" onkeyup="passinput()" /><input type="hidden" name="pass" />

</form>

</body>

</html>

※ 上記のプログラムの <!ーー と ーー> は半角に置き換えてください。

時間の関係で、雰囲気が分かる程度の雑なプログラムになりましたが、

一応半角英数字をゆっくり入力すると伏字「*」になります。

document.aaa._pass.value = document.aaa._pass.value + "*";の部分の"*"を"■"などに変更すると、伏字を変更することができます。

かなり荒業ですが、上記のプログラムを修正すればできるかもしれませんw

質問者が未読の回答一覧

 回答者回答受取ベストアンサー回答時間
1 ana_log 114 108 22 2010-02-11 18:16:21
  • id:ana_log
    あ、ごめんなさいちょっと勘違いしてました
    普通の文字として表示ではなくて、■や※に変更したいってことでしょうか
    だとしたら見当違いな回答ですのでオープンしないでください

    また、その場合は内部で決まっているので文字を変更することはできません
    http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1118690906
  • id:memamii
    ana_logさんありがとうございました。
    できないとなると・・・カスタムタグでも作成するしかないのかなぁ・・
  • id:memamii
    皆様ありがとうございました。
    質問の意図としては、「●」を半角にしたかっただけなのですが、探したらMicrosoftのサイトに資料がありました。IE7の仕様で、以前よりも大きな「●」となることがあるそうで。
    ardarimさんの回答のサイトは試しましたが、今回は、Microsoftの対応をしてみます。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません