jQueryの $(function(){ });について
- jQueryの $(function(){ });について基本的な質問をさせてください。基本的にjQueryは、お約束として $(document).ready(function(){ }); と記述し、その中に実行処理を書いていくと思うのですが、loadを待たずに実行させたい時は $(document).ready(function(){ }); は記述しなくてもよいのでしょうか？
- どの本をみてもjQueryのお約束事みたいに $(document).ready(function(){ }); を必ず書くと載っています。自分でやってみたところ、記述しないでも問題なく動いているのですが、やっぱり $(document).ready(function(){ }); を記述しないと、何か問題があるのでしょうか？
- ご存知の方、教えてください。どうぞ宜しくお願いたします。
- ベストアンサー
jQueryの $(function(){ });
jQueryについて基本的な質問をさせてください。 基本的にjQueryは、お約束として $(document).ready(function(){ }); と記述し、その中に実行処理を書いていくと思うのですが loadを待たずに実行させたい時は $(document).ready(function(){ });は記述しなくてもよいのでしょうか？ どの本をみてもjQueryのお約束事みたいに $(document).ready(function(){ }); を必ず書くと載っています。 自分でやってみたところ、記述しないでも問題なく動いているのですが、 やっぱり $(document).ready(function(){ }); を記述しないと、何か問題があるのでしょうか？ ご存知の方、教えてください。 どうぞ宜しくお願いたします。
- mc0816
- お礼率94% (69/73)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
こんにちは。 別に書かなくても大丈夫な処理であれば大丈夫ですよ。 $().ready ( function() { }); と書く事が多いのはDOMを操作することが多いからだと思います。 なのでDOMの構築が終了後に実行されるように書きます。 DOMにアクセスするような記述をそのまま何も書かないで実行したら思った動きにはならないと思います。 例えば<head></head>内に <script type="text/javascript"> $('body').append ( "あああ" ); </script> と書いた場合はまだbodyがありませんので"あああ"は追加されません。 <script type="text/javascript"> $().ready ( function() { $('body').append ( "あああ" ); }); </script> とすれば追加されます。 <body> <script type="text/javascript"> </script> $('body').append ( "あああ" ); </body> これは追加されます。
関連するQ&A
- jQueryでloadしたページ内でもjQueryを使う方法
例えば、base.html内にjQueryでadd.htmlをloadします。 base.htmlに下記コードを記述 $(document).ready(function(){ $("a").click(function(){ alert("click"); return false; }); }); base.htmlに直接記述したaタグではアラートが出ますが、 base.htmlに読み込んだadd.html内のaタグでは適用されません。 Ajaxで読み込んだページ内にもjQueryを使用したい場合には、 どのようにすればよいのでしょうか？
- 締切済み
- AJAX
- jQueryにて複数ライブラリを動かす
wordpressにてWEB制作を行っています。 jQueryにてfullpage.jsというフルページスクロールするライブラリを使用しております。 そのセクションの一つをfullpage.jsの機能の一つ横スライドを行っているのですが、 fullpage.jsのオプションには自動再生はありません。 スライド部分のみ自動再生を行いたいので bxslider.jsというライブラリを使用し、 横スライドしたいセクションをbxsliderで動かしたいのですが、 bxsliderが全く作動しません。 また <script type="text/javascript"> jQuery(document).ready(function(){ jQuery('.bxslider').bxSlider(); }); </script> の記述を <script type="text/javascript"> jQuery(document).ready(function() { jQuery('#fullpage').fullpage(); }); の上に書くと今度はfullpageが動きません。 jQueryライブラリは同ページで二つ同時には動かないんでしょうか？ また、書き方が間違っていますでしょうか？ 宜しくお願い致します。
- 締切済み
- JavaScript
- JQueryでのloadの動作がFirefoxで動かなくて困っています
JQueryでのloadの動作がFirefoxで動かなくて困っています。 サイトのheaderとfooterを外部htmlにして、JQueryのloadで呼び出し指定のdivに出力するようにしたいのですが、IEでは上手くいきましたが、FFでは全く動きません。 $(document).ready(function(){ $("#header").load("../js/header.html #header"); $("#footer").load("../js/footer.html #footer"); });
- 締切済み
- AJAX
- JQUERYについて教えてください。
JQUERYについて教えてください。 readyがDOMを読み終わってから実行しろという意味は分かったのですが、 あったりなかったりするfunction()はどんな意味なのでしょうか？ function(){ $(this).stop().animate({'marginBottom':'60px'},150); },function(){ $(this).stop().animate({'marginBottom':'0px'},120); こちらにあるのですがメソッドに一個必須なのでしょうか？ 例 <script type="text/javascript"> $(document).ready(function(){ $('div#goto_top').hover( function(){ $(this).stop().animate({'marginBottom':'60px'},150); },function(){ $(this).stop().animate({'marginBottom':'0px'},120); </script>
- ベストアンサー
- JavaScript
- jQueryでの書き方について
HTMLファイルから読み込まれるJavaScriptファイルに次のような書き方がありました。 (function($){ $(function(){ // DOM操作などの処理を記述 ... ... }); })(jQuery); このような書き方を初めて見たのですが、これはどのような意図があるのでしょうか？ HTMLの読み込みが完了してから処理を始めるように、次のような書き方はよく見るのですが、これとは何が違い、どう使い分けるのでしょうか？ $(function(){ // DOM操作などの処理を記述 ... ... }); ■環境 jQuery 2.1.3
- ベストアンサー
- JavaScript
- $(document).readyとloadの違い
■質問1 jQueryの「$(document).ready(function()」と「$(window).load(function()」は何が違うのでしょうか？ 下記理解で合ってるでしょうか？ ●$(document).ready(function() ・複数回実行できる ・ページを全て読み込んだ後に実行 ・ページの下部に記述しなくとも良い ●$(window).load(function() ・複数回実行できない(最後の1回が実行される) ・ページ読込開始時点で実行(正確には記述位置に来た時点？) ■質問2 「jQuery記述」と「JavaScriptだけで記述」とでは、内容やタイミングに違いはありますか？ ・どちらも同じ？ 「$(window).load(function()」V.S「window.onload = function(){」
- ベストアンサー
- JavaScript
- JQueryがChromeで動くがＩＥで動かない
JQueryで書いた単純なJavaScriptが ＩＥで動かず困っています。 Firefoxでも動いており F12のデバッガを使ったとき、 Chromeと、Firefoxはデバッグポイントでストップするのですが、 ＩＥだけ、そもそもFunctionの中に入ってきません。 $(function(){ //do something }); ちなみに、documentのreadyや、ドロップダウンリストボックスのchangeのイベントです。 お知恵をお借りできませんでしょうか？ 宜しくお願い致します。
- ベストアンサー
- JavaScript
- Jquery アコーディオンについて
知恵袋、Web初心者です。 Jquery / アコーディオンについて質問です。 Jqueryを使って２段のアコーディオンメニューを実装しているのですが、 １つのアコーディオンを押すと他のアコーディオンが閉まる様設定したいです。 現在下記の様に記述しています。 ----------------------------------------- $(document).ready(function(){ $('.accordion').click(function() { $('.accordion').next().slideUp(); $(this).next().slideToggle(); }).next().hide(); }); ---------------------------------------- この記述ですと２段目のアコーディオンを押すと１段目も閉じてしまい、結果的に２段目も見えなくなってしまう、 という状況です。 ２段目だけ機能させる事は可能でしょうか？？ 質問が分かりにくかったら申し訳ありません。 初歩的な質問かも知れませんが、ご教授頂ければ幸いです。 よろしくお願い致します。
- ベストアンサー
- JavaScript
- 親フレームのjQueryオブジェクトを使えるか？
html（親html）上に別のhtml（子html）を<iframe>で表示しています。 親htmlではjQuery（v1.8.2）を使用しています。 子htmlでもjQueryを使いたいです。 単純に子htmlでjquery.jsを読み込めば良いですが、勉強のため以下のように親htmlのjQueryオブジェクトを使って実現してみました。 【子htmlのscript】 var $ = parent.jQuery; $(window).load(function() { $("body", document).append( "hoge" ); }); これで見た目は正しく動作してますが、以下の不明点が出てきたので質問させて下さい。 【質問】 $(window).loadではなく$(document).readyを使った場合は"hoge"が追加されていませんでした。 <body>要素がまだ読み込めていないせいかとも思いましたが、documentの読み込み完了後に実行されているはずです。 なぜ"hoge"が追加されないのでしょう？ このdocumentは親htmlのdocumentなのでしょうか？ ただ、$("body").append( "hoge" )と書いた場合は親htmlに"hoge"が追加され、$("body", document).append( "hoge" )と書くことで子htmlに"hoge"が追加されるようなので、親htmlのdocumentではない気がします。 よろしくお願いします。
- 締切済み
- JavaScript
- jQueryの多重読込
2つのHTMLがあり、両方ともjQueryプラグインを使っています。 今回、a.html側に、jQuery loadで、b.htmlを読込みました。 ■a.html jQuery 本体 jQueryUI jQueryForm jQuery.HashChanged など基本js（多数） ■b.html jQuery.Gallerific jQuery.Fancybox jQuery.fixPing などメディア系統js（多数） ■困っていること 両方とも、$(function(){ ... }) 構文を使って、DOMの展開完了を待っているのですが、「読込まれる側=b,html」の、$(function(){ ... }) がうまく働いていないようなのです。 b.html 単体では何の問題もないのですが、a.htmlにloadされると、遅延読み込みがききません。 元である a.html で全部のjQuery プラグインを読むのは重すぎるため、各々で必要なプラグインを都度、読むようにしたいのですが、その場合、読み込まれる側の実行遅延（DOM展待ち）はどのようにしたらいいでしょうか？
- ベストアンサー
- JavaScript
お礼
大変、分かりやすい解説をありがとうございました。 例まであげていただいて、とてもよく理解できました。 スッキリしました！ なるほど… 絶対、記述しないといけないわけではないんですね。 DOMにアクセスするものは、 $(document).ready(function() { }); の中に記述して、うまく使い分けて、やっていきたいと思います。 本当にありがとうございました！！