勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

バニラJavaScriptでinputタグのtypeをtext⇔passwordに変更する方法

   2024/06/19  JavaScript

チェックボックスの状態によってinputタグのtypeをtext⇔passwordへ切り替えたかった。jQueryのattrでいけると思ったら無理だったのでメモ。

 

ソース

パスワード:<input type="text" id="pass"><br />
<input type="checkbox" value="1" onChange="document.getElementById('pass').type = (this.checked) ? 'text' : 'password';">パスワードを表示

 

その他

checkboxを変更(onChange)した時に、checkboxの値が1の(チェックされている)場合にid=passのtypeをtextへ変更。

 

jQueryだとできない?(参考サイト)

http://myjquery.blog.fc2.com/blog-entry-14.html#modified-11

1.9からはブラウザによって出来るかもとのこと。

JSだったらwin7のIE9/FireFox25.0.1/Chrome 31.0.1650.63/

iphone5で動作確認できた。

 - JavaScript

  関連記事

jQueryで対象の要素をまとめて親要素で囲む方法

あるシステムで出力されているHTMLタグを指定した親要素で囲みたいというケースが ...

Leafletで「leaflet-search」プラグインを導入してマーカーの検索機能を追加する方法

LeafletとOpenStreetMapでマップ上にマーカーを複数設置した上で ...

jQueryの日付&時間のピッカー(bootstrap-datetimepicker)について

日付のピッカーはよく見るけど、時間のピッカーはあまり見ないので、普通のセレクトメ ...

アンカーリンクでURLに「#hoge」のようなパラメータを残さずスクロールさせる方法

アンカータグをクリックしてもブラウザのURL欄に「#hoge」のようなハッシュを ...

日本地図のクリッカブルマップをjQueryで実装する方法(japan-map)

JavaScriptもしくはjQueryで日本地図を表示し、都道府県や八地方区分 ...