rails を用いてtodoアプリを作成しています。
機能の中に画像を表示・非表示を行う機能を追加したいのですがうまくいきません。
jQueryを用いることで実装を行うことができると検索で知り挑戦しているのですが、知識不足のためエラーで止まってしまっています。
解決したいこと
railsの"hi.jpg(app/aseets/images/hij.jpg)"をjQueryのtoggle();を用いて表示・非表示をクリックによって行いたい。
現状
ページにて検証を用いてconsolを確認するとFailed to load resource: the server responded with a status of 404 (Not Found)との表記が出されている。
実際のページ内にはボタンと画像が表示されることを想定していたが、ボタンは作成されており画像が"壊れた画像"のアイコンがある。
app/aseets/javascripts/tasks.js $(function () { $('button').on('click', () => { $('hi.jpg').toggle(); }); });
app/views/tasks/index .tasks-text 作業内容: =task.tasktext %button ここをクリック %img{:src => "asset_path""hi.jpg"}/
試したこと仮説
Failed to load resource: the server responded with a status of 404 (Not Found)
の内容から、持ってくるべき画像のファイルはないよと解釈しました。
画像を指定するパスが間違っているのかと考えjsでの画像の引用方法を検索
https://codenote.net/ruby/rails/1127.html
↑ ファイル引用のために参考にさせていただいたサイト
jsでrails内の画像を用いるには /assets/images/hi.jpg"}/のような表記方法が有効とのことでしたが解決できませんでした。
https://www.sejuku.net/blog/40705
↑ toggle();を使うために参考にさせていただいたサイト
GET http://localhost:3000/asset_pathhi.jpg 404 (Not Found)
%img{:src => "asset_path""hi.jpg"}/だと↑の表記
GET http://localhost:3000/assets/images/hi.jpg 404 (Not Found)
%img{:src => "/assets/images/hi.jpg"}/だと↑の表記
になります。
解決のためお知恵を貸していただけると幸いです。
よろしくお願いします。
Rails 5.0.7.2
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。