前提・実現したいこと
ほぼ初心者です。よろしくお願いします。
ページ1では3つの画像がランダムに表示されるようなコードになっていると思います。その内容をページ2で表示したいのですが、画像はちゃんと3つ表示されますが、ランダムには表示されません。ページ2での表示もページ1同様、ランダムで表示されて欲しいのですがどうやってもうまくいきません。functionとloadでは要素を引っ張ってくることはできてもランダムに表示することは不可能なのでしょうか。
発生している問題・エラーメッセージ
エラーメッセージ
該当のソースコード
<!--ページ1の内容--> <div id="sample"> <script type="text/javascript"> jQuery(function($) { $.fn.extend({ randomdisplay : function(num) { return this.each(function() { var chn = $(this).children().hide().length; for(var i = 0; i < num && i < chn; i++) { var r = parseInt(Math.random() * (chn - i)) + i; $(this).children().eq(r).show().prependTo($(this)); } }); } }); $(function(){ $("[randomdisplay]").each(function() { $(this).randomdisplay($(this).attr("randomdisplay")); }); }); }); </script> <ul randomdisplay="20"> <li><img src="https://2.bp.blogspot.com/-vZRh5cey3yc/WzC-pA4QK8I/AAAAAAABNDw/JObsGPB24p4LNRBSsje-OVP-fzUTX5OFQCLcBGAs/s180-c/mukiryoku_ojisan.png"></li> <li><img src="https://2.bp.blogspot.com/-kMbdxwET8Go/Wn1VcZ9oGBI/AAAAAAABKCY/7dL-doSO7EgkxvT97_5W7VPiy0_lsPRAgCLcBGAs/s180-c/agura_kutsurogu3_ojisan.png"></li> <li><img src="https://2.bp.blogspot.com/-XbDwFIHMuwM/WM9YN_S8OMI/AAAAAAABCwo/klUJi7odxUQgQmpaMEpKzPdAlWwbqdE9ACLcB/s180-c/sick_rougan.png"></li> </ul> </div> <!--ページ1の内容ここまで--> <!--ページ2の内容--> <div id="aaa"></div> <script type="text/javascript"> $(function() { $("#aaa").load("ページ1のURL #sample"); }); </script> <!--ページ2の内容ここまで-->
試したこと
ここに問題に対して試したことを記載してください。
補足情報(FW/ツールのバージョンなど)
ここにより詳細な情報を記載してください。