ユーザーにページが表示される前にjQuery呼び出し/プラグインをロード

メインWebページがロードされた後、使用するすべてのjQuery関数とプラグインがロードを開始することがわかりました。これは大きな問題ではありませんが、私は<forms>要素をスタイルし、エラーメッセージを隠すためにjQueryを使用しています。ユーザーが1秒間ページにアクセスすると、醜いフォームとすべてのメッセージが表示され、jQueryのロードよりもうまくなります。ユーザーにページが表示される前にjQuery呼び出し/プラグインをロード

私は</head>タグの前に私のjQueryプラグインコールと機能を含んでおり、

$(document).ready(function() { //My Code Here });

コード例にそれらをラップ：

<script type="text/javascript"> 

$(document).ready(function() { 
    //Form stylin 
    $('form').call_form_styling('form' , { labels: true, }); 

    //Hide error div's with class = "error" 
    $('.error').hide(); 

}); 

</script> 
<head> 
<body> 
<form> 
<!-- Suff like inputs here --> 
<div class="error">error</div> 
<form> 
<! -- other code bla bla --> 
</body>

だから、あなたがいずれかを提案してください可能性がありページの前にjQuery関数とプラグインをロードするソリューションユーザーに表示されるので、醜いものは見えません。

出典

2011-12-09 Ilja

タグが読み取られた後、 '$（document）.ready'が読み込まれます。おそらくもっと良い解決法があるかもしれませんが、要素を書いた後はいつでもjqueryスクリプトを直接呼び出すことができますし、 'ready'を使ってすぐに消すことはできません。 – jwatts1980

jQueryの.hide()の内容を読んでいると、要素の表示状態がnoneに設定されていることがわかります。

<div class="error">error</div>が<div class="error" style="display: none;">error</div>

を次のようになります。したがって、この問題の周りの一つの方法は、あなたが再びそれらをフェードインするためにjQueryを使用することができるようにして、例えば、ページのロード時に非表示にするあなたの要素のためのいくつかのインラインスタイルを設定することです

出典

2011-12-09 16:38:43

それは1つの問題の解決策です、あなたはform_stylingに関する提案はありますか？どのようなルールをCSS/javascriptルールをフォームに適用して、チャンクボックスや入力などのスタイルを適用しますか？ – Ilja

私はあなたのフォームと入力にクラスを使用し、フォームが提出されたらそのクラスだけを適用します。 –

私はあなたの書式がスタイルにされるまであなたの書式を隠してから、それを表示することをお勧めします。または普通の人のようにCSSでスタイルを設定してください;）

出典

2011-12-09 16:39:36 idrumgood

実際の人のようなええ; Dは、その大部分がjQueryの機能性であるということです。プレースホルダー、スライドなどで消える – Ilja

私はまずcssを読み込み、おそらくディスプレイにnoneを追加することをお勧めします。

<form style="display:none;"> 
    <div class="error">error</div> 
</form>

最後のbodyタグの後にJSを配置します。 jQueryがロードされたら、クラスを変更したり、フォームにイベントを追加したりすることができます。

出典

2011-12-09 17:20:09 Vish

ユーザーにページが表示される前にjQuery呼び出し/プラグインをロード

答えて

関連する問題