勉強したことのメモ

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

  関連記事

Leafletでマーカーをグループ化し、チェックボックスの状態により表示非表示を切り替える方法
Leafletでマーカーをグループ化し、チェックボックスの状態により表示非表示を切り替える方法

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

クロスドメイン環境のiframeで子フレームから親フレームに値を渡す方法
クロスドメイン環境のiframeで子フレームから親フレームに値を渡す方法

クロスドメインの環境でiframeを使用しており、子フレーム側から親フレーム側に ...

JavaScriptでFlashのバージョンを取得する方法
JavaScriptでFlashのバージョンを取得する方法

Flashのバージョン取得をjavascriptで行うソースコードのを以下にメモ ...

SortableJSを使ってデータの並べ替え&保存
SortableJSを使ってデータの並べ替え&保存

あるシステムを拝見した際にtableタグ内に並んでいる項目をドラッグ&ド ...

javascriptで月末日を取得
javascriptで月末日を取得

以前、PHPで月末日を取得したけれども javascriptで月末日を扱いたいケ ...