- ベストアンサー
※ ChatGPTを利用し、要約された質問です（原文：jqueryで画像を切り替えたい）
jQueryで画像を切り替える方法とは？
このQ&Aのポイント
- jQueryを使用して画像を切り替える方法について説明します。
- 具体的には、index.htmlファイルにulタグを追加し、各li要素に果物のメニューを配置します。その後、jQueryのclickイベントを使用して、メニューがクリックされたら対応する画像を表示するようにします。
- この方法を使えば、index.htmlファイルの左側にメニューを設け、メニューをクリックすると画像が切り替わる機能を実装することができます。
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
こんにちは。 画像の切り替えにAjaxを使う必要はありませんが、2パターン作ってみました。 サンプル1はAjaxを利用せず、画像を変更します。 サンプル2はAjaxを利用してdata.txtよりJSONデータを読み込んで、適切な画像を表示しています。 動作サンプルよりソースを表示して、どういった処理を行なっているか見てみてください。 ==== 動作サンプル http://hppg.moe.hm/okwave/qa/q7364555/ ==== data.txtの中身 {"ringo":{"url":".\/images\/ringo.png","alt":"\u308a\u3093\u3054\u306e\u753b\u50cf(Ajax\u3067JSON\u30c7\u30fc\u30bf\u3092\u53d6\u5f97)"},"mikan":{"url":".\/images\/mikan.png","alt":"\u307f\u304b\u3093\u306e\u753b\u50cf(Ajax\u3067JSON\u30c7\u30fc\u30bf\u3092\u53d6\u5f97)"}}
お礼
情報ありがとうございます。 参考ソースを見せていただきました。 JSONがありました。 ちょっとここ勉強してないので 勉強しなおしてから改めて見させていただこうと思います。 ご丁寧にありがとうございました。