1

バックグラウンド

「検索」という単語を含むように検索フィールドを設定し、フィールドがクリックされたりクリックされたりしたときにそれをクリア/リセットするjQuery関数がいくつかあります。

// Search Box Placeholder
jQuery('#q').focus(function() {
            if(jQuery(this).val() == 'Search') {
                jQuery(this).val('');       
            }
            else if(jQuery(this).val() == '') {
                jQuery(this).val('Search');
            }
        });
jQuery('#q').blur(function() {
            if(jQuery(this).val() == '') {
                jQuery(this).val('Search');             
            }
        });
jQuery('#q').val('Search');

質問 ？

唯一の問題は、代替の検索用語が設定されていない状態で検索フォームが送信された場合に、検索という単語をクリアする方法がわからないことです。内容が「検索」と等しい場合、フォーム送信前に内容を確認してクリアする方法はありますか？

4

3 に答える 3

2

値が「検索」と等しい場合は、フォームの送信を防ぐことができます。

$('form').on('submit', function(){
   return $('#q').val() !== 'Search';
});

プレースホルダー属性をサポートしていない古いブラウザーをサポートする場合は、プラグインを使用することもできます。

https://github.com/parndt/jquery-html5-placeholder-shim

于 2013-03-12T22:21:16.920 に答える
1

この種のことに対する答えを見つけるための鍵は、多くの場合、何よりも用語を知ることです。

この場合、「模倣」ではなく「ポリフィル」という単語を検索すると、解決策が見つかります。「Polyfill」は、古いブラウザで動作するように新しいブラウザの機能を実装するブラウザスクリプトについて話すWeb開発者です。

プレースホルダー機能は非常に便利で簡単に実行できるため、このための古典的な機能です。

Modernizrは、ポリフィルの操作プロセスを簡素化することを目的としたJavascriptライブラリです。機能がサポートされているかどうかを検出するため、その機能のポリフィルをロードするかどうかを知ることができます。

これは便利なツールですが、Modernizrについて言及する主な理由は、ポリフィルスクリプトの大きなリストも保持しているためです。

そのリンクをクリックして「プレースホルダー」を検索してください...それを実行できるスクリプトのスタック全体が見つかります。自分に最適なものを選ぶか、彼らが使用しているテクニックからベビーベッドを選んでください。

お役に立てば幸いです。

于 2013-03-12T22:34:11.237 に答える
0

検討したい代替案は、コントロールの値としてプレースホルダーテキストを追加しないことです。代わりに、テキスト入力の上に絶対的に配置された別の要素（入力ラベルまたはスパンなど）を使用し、対応する入力にコントロールがある場合は非表示にします。また、ユーザーがこのラベルをクリックしたときは、ラベルを非表示にして、フォーカスをコントロールに設定する必要があります。これにより、プレースホルダーの色を変更することもできます。

于 2013-03-12T22:23:53.277 に答える