質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

1回答

927閲覧

function + load で要素をランダムで表示させる方法

fudo

総合スコア8

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2019/12/11 14:49

編集2022/01/12 10:55

前提・実現したいこと

ほぼ初心者です。よろしくお願いします。
ページ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/ツールのバージョンなど)

ここにより詳細な情報を記載してください。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

swordone

2019/12/11 15:03

JavaとJavascriptは別物です。タグを修正してください。
fudo

2019/12/11 22:39

修正しました。ご指摘ありがとうございます。
guest

回答1

0

jQuery の load関数の仕様上、この質問のような書き方だと、ページ2 ではページ1 のスクリプト部分は実行されません。
https://api.jquery.com/load/#script-execution

解決方法はいくつかありますが、詳細は「jquery load script 動かない」等で検索してください。

投稿2019/12/12 00:58

2KOH

総合スコア999

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問