入力属性プレースホルダー

フォームのこのような素晴らしい属性をプレースホルダーとして使用するというトピックがすでに提起されています。 さらに、jsの例も示しました（プレースホルダーという単語を検索します）。 IEデータでは属性が実行されないため、失望が何度も表明されました。



属性自体は非常に便利です。 フォーム（特にポップアップフォーム）を作成するときのスペースを節約することは特に喜ばしいことです。 したがって、属性を放棄するのではなく、単に自身とInternet Explorerの宣言を支援することを決定しました。 JQueryは支援のために呼び出されました。



私のワークショップの隣人は、作成プロセス中に「プラグインでそれをやる」と叫びましたが、プラグインにはまだ呼び出しが必要なので、気にせず、通常のスクリプトにしないことにしました。



jQソリューションはシンプルで要求の厳しいものです。 コードはどこにでも埋め込むことができます（もちろん、「script」タグを忘れないでください）。

$(document).ready(function() { /* Placeholder for IE */ if($.browser.msie) { //      IE $("form").find("input[type='text']").each(function() { var tp = $(this).attr("placeholder"); $(this).attr('value',tp).css('color','#ccc'); }).focusin(function() { var val = $(this).attr('placeholder'); if($(this).val() == val) { $(this).attr('value','').css('color','#303030'); } }).focusout(function() { var val = $(this).attr('placeholder'); if($(this).val() == "") { $(this).attr('value', val).css('color','#ccc'); } }); /* Protected send form */ $("form").submit(function() { $(this).find("input[type='text']").each(function() { var val = $(this).attr('placeholder'); if($(this).val() == val) { $(this).attr('value',''); } }) }); } });
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

喜んでレイアウト。



PSフィールド内のテキストの色、およびテキストフィールド（type = "text"）だけでなく属性が使用されているという事実については、すでにコメントしています。 もちろん、これについては知っています。おそらく少し後で、このスクリプトをより消化しやすいバージョンに変更します。 しかし、彼が作成されたときの主な基準は「速く、安くて陽気な」であり、彼は同様の仕事に対処しました。 また、スクリプトの汎用性については...少し後で説明しましょう。