jQueryではinputのtypeの変更ができないのでgetを使って対処した

<input type="password" id="target">
<button id="button">Change!</button>

buttonを押すとinputのパスワードの伏字を解除するボタンをjQueryで作ろうとします。

 

<script type="text/javascript">
$("#button").on({
    'click': function() {
        $('#target').attr('type', 'text');
    }
});
</script>

としてみたのですが以下のようなエラーが表示されました。

Uncaught Error: type property can't be changed

jQueryではinputのtypeの変更は出来ないようです。

 

そこで、処理の部分だけjQueryを使わずに書きます。

<script type="text/javascript">
$("#button").on({
    'click': function() {
        $('#target').get(0).type = 'text';
    }
});
</script>

 

↓のようにinputのtypeをtextに変更することが出来ました。

この記事を書いた人:

ナカシマ

北区赤羽在住のWEBデザイナー兼エンジニア。インターネット、WordPress、本・漫画、音楽が大好き。妻と猫と暮らすアップル信者。

BLOG: 着ぐるみ追い剥ぎペンギン