勉強したことのメモ

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

  関連記事

「slick」でブラウザ幅がPCの場合はスライダーを表示し、スマホ幅の場合はスライダー無しにする方法
「slick」でブラウザ幅がPCの場合はスライダーを表示し、スマホ幅の場合はスライダー無しにする方法

slickプラグインで画像スライダーを設置しているページがあり、PCのブラウザ幅 ...

Leafletにタグフィルター機能を実装できる「leaflet-tag-filter-button」プラグインの利用方法
Leafletにタグフィルター機能を実装できる「leaflet-tag-filter-button」プラグインの利用方法

以前にLeafletでマーカーをグループ化し、チェックボックスの状態により表示非 ...

JavaScriptで連想配列を数値の降順でソートする方法
JavaScriptで連想配列を数値の降順でソートする方法

JavaScriptで連想配列を数値の降順でソートしたかったんだけど、色々調べて ...

JavaScriptにて領収書等のテンプレートHTMLページをPDFファイル化させる方法(html2pdf)
JavaScriptにて領収書等のテンプレートHTMLページをPDFファイル化させる方法(html2pdf)

JavaScriptにてhtml2pdfというライブラリを使用することでHTML ...

八地方区分→都道府県→路線→駅名の連携したセレクトメニュー の実装方法
八地方区分→都道府県→路線→駅名の連携したセレクトメニュー の実装方法

八地方区分(関東、近畿等)をプルダウンから選ぶと区分内の都道府県プルダウンが表示 ...