ホームページ > ウェブフロントエンド > jsチュートリアル > JSはfocus_javascriptスキルの取得・喪失に応じてパスワードボックスの消失・表示効果を実現します

JSはfocus_javascriptスキルの取得・喪失に応じてパスワードボックスの消失・表示効果を実現します

WBOY
リリース: 2016-05-16 15:29:43
オリジナル
1532 人が閲覧しました

この記事の例では、フォーカスの取得と喪失に基づいたパスワード ボックスの消失と表示効果の JS 実装について説明します。参考のために皆さんと共有してください。詳細は次のとおりです:

もの:

1. まず、パスワードボックスを一時的に txt に置き換え、デフォルト値
2. テキスト ボックスにフォーカスが移ったら、デフォルト値をクリアし、タイプをパスワードに変更します。
3. テキスト ボックスがフォーカスを失ったら、タイプを txt に変更し、デフォルト値を「パスワードを入力してください」に設定します。

JS コード:

window.onload=function(){
  var input=document.getElementById('input');
  input.onfocus=function(){
    if(this.value=='请输入密码'){
      this.value='';
      this.type='password';
    };
  };
  input.onblur=function(){
    if(!this.value){
      this.type = 'text';
      this.value = '请输入密码';
    };
  };
};
ログイン後にコピー

HTML コード :

コードをコピー コードは次のとおりです:


追記: ここでは、非常に強力で使いやすい JavaScript の圧縮、書式設定、暗号化ツールをお勧めします (コードを暗号化したい人には、ここで js 暗号化関数を試してみてください):

JavaScript 圧縮/フォーマット/暗号化ツール: http://tools.jb51.net/code/jscompress

さらに、上記の js ツールの暗号化には eval 関数暗号化形式が使用されており、このサイトでは非常に強力で実用的な eval 関数暗号化用の次の復号化ツールも提供しています。

JS eval メソッドのオンライン暗号化および復号化ツール: http://tools.jb51.net/password/evalencode

この記事が JavaScript プログラミングのすべての人に役立つことを願っています。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート