ホームページ > 記事 > ウェブフロントエンド > IE8_javascriptスキルで入力のtype属性を変更するときのエラーの解決策
IE8_javascriptスキルで入力のtype属性を変更するときのエラーの解決策
- WBOYオリジナル
- 2016-05-16 16:36:201408ブラウズ
概要:
図に示すように、ユーザーが [クリア テキストを表示] チェック ボックスをオンにすると、ユーザーが入力したパスワードがクリア テキストで表示される必要があり、チェック ボックスを削除した場合は元に戻す必要があります。最初に思いつくのは、入力ボックスの型を変更して、jQuery の attr を使用してテストを行うことです。問題はありませんが、ie8 では入力の変更が許可されていないことがわかりました。最終的には、別のアプローチを使用して実装されました。
Show Plain Text がチェックされている場合は、入力ボックスを type="text" に置き換えます。 チェックされていない場合は、入力ボックスを type="password" に置き換えます。 コードは次のとおりです。
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script src="jquery.min.js"></script>
</head>
<body>
<span id="pass"><input name="password" type="password"></span><label><input type="checkbox" id="show-password">显示明文</label>
<script>
$('#show-password').click(function() {
var inp,cname,val;
if(this.checked) {
inp = $('#pass').children('input');
cname = inp.attr('name');
val = inp.val();
$('#pass').html('<input name="'+cname+'" value="'+val+'" type="text">');
} else {
inp = $('#pass').children('input');
cname = inp.attr('name');
val = inp.val();
$('#pass').html('<input name="'+cname+'" value="'+val+'" type="password">');
}
});
</script>
</body>
</html>
この記事には技術的な内容はありませんが、この種のインタラクションは主に IE8 以下の互換性の問題を考慮するために書かれています。あなたのプロジェクトにこの種のインタラクションがある場合は、それを参照することができます。または、より良い方法がある場合は、それを私と共有することができます。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。