- ベストアンサー
input要素のtype属性を変えたい
携帯サイトのパスワード入力フォームで、最後に入力した1文字だけ表示し、他をマスクするというものがあり、面白いなと思ってPCサイト用にJavascriptで作ってみようと思いました。HTML部に <input type="password" id="pass" /> と書き、初期設定としてJavascript部に window.onload = function() { var input = document.getElementById("pass"); input.type = "text"; input.onkeydown = 実装する関数; } と書いています。これはHTMLにイベントハンドラを設定したくない（HTMLとJavascriptを分離させたい）からです。type属性がpasswordだとどうやっても文字は見えないので、textに変えてキーが押されるごとに最後の文字以外をマスクしてvalueに挿入する方法を考えていますが、これがうまくいきません。どうやらtype属性は値を取得することは可能ですが、挿入（置き換え）することはできないようなのです（ここでエラーが起こっているようです）。他に input.removeAttribute("type"); input.appendAttribute("type", "text"); といったやり方も試してみましたが、うまくいきませんでした。 これは仕様で、どうやっても無理なのでしょうか？ <input type="password" /> を <input type="text" /> に変えれば対処できる問題ですが、Javascript不使用ユーザーにも対応できるようにしたいので、なんとか<input type="password" />形式のまま解決できませんでしょうか？
- taku17
- お礼率11% (87/767)
- JavaScript
- 回答数2
- ありがとう数0
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
携帯に関してはよくわかりませんが・・・ タグを作成し直すとか、あるいはタグごと置き換えてしまえばよいのでは？ <html> <head> <script type="text/javascript"> function hoge() { var e=document.getElementById('pass'); e.outerHTML='<input type="text" id="pass" value="test">'; } </script> </head> <body> <input type="password" id="pass"> <p><button onclick="hoge()">書換え</button> </body> </html>
その他の回答 (1)
はじめまして。 input.setAttribute("type", "text"); 私の環境では、これで変換できました。
