1

私は現在、インラインjavascriptを使用して、フォーカス時に入力テキストのデフォルト値をクリアしています。ユーザーが何も入力しない場合、デフォルト値はぼやけて表示されます。次のようにコーディングします。

onfocus="if(this.value==this.defaultValue) this.value='';" onblur="if(this.value=='') this.value=this.defaultValue;"

問題は、サイト全体で入力されたすべてのテキストにこのスニペットを追加する必要があるという事実にあります。これに相当するjQueryは、すべてのテキスト入力(:text)に対して自動的にこれを実行します。

私は2つのエラーで以下を作成しました。(1)テキストフィールドが持つ可能性のあるすべての値をクリアします。値がデフォルトのattr値である場合にのみクリアしたい。(2)ぼかし機能はデフォルト値を挿入しません。信じられないほどシンプルなものが欠けていると確信しています。

$(':text').focus(function() {
            var value = $(this).val();
            var defval = $(this).attr('value');
            if(value == defval) {
                $(this).val('');
            }
        });
        $(':text').blur(function() {
            var value = $(this).val();
            var defval = $(this).attr('value');
            if(value == '') {
                $(this).val(defval);
            }
        });

前もって感謝します!

4

1 に答える 1

2

defaultValueの代わりにhtml5プレースホルダーを使用し、プレースホルダーがサポートされていない場合にのみJSにフォールバックして、最新のブラウザーにこれを処理させることをお勧めします。

とにかく、これはdefaultValueを使用した単純な実装です。

$('input[type="text"]').on({
    focus: function(){
        var $this = $(this);
        if($this.val() === $this[0].defaultValue) $this.val('');
    },
    blur: function(){
        var $this = $(this);
        if($this.val() === '') $this.val($this[0].defaultValue);
    }
});

さらに、プラグインを使用することを強くお勧めします。プラグインは、これらすべてといくつかの考えられるコーナーケースを処理するからです...

見てください:

http://unwrongest.com/projects/defaultvalue/

于 2012-07-04T17:08:11.760 に答える