前提・実現したいこと
Railsにgemでjqueryを入れ、順調に動きました。
その後jquery-uiも入れて、ドラックアンドドロップをつけました。
jqueryのonメソッドを追加したところ、それだけが動きません。
発生している問題・エラーメッセージ
エラーは表示されません。
onメソッドでクリックで色が変わるようにしているのですが、クリックにしてもマウスオーバーにしてもダメでした。
該当のソースコード
[application.js] //= require jquery //= require jquery-ui //= require jquery.turbolinks //= require rails-ujs //= require turbolinks //= require activestorage //= require_tree .
[application.css] *= require jquery-ui *= require_tree . *= require_self
[application.html] <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => 'reload' %> <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
[html.erb] //省略 //.anime_testはjqueryが動くか実験で作った要素です。 <p class="anime_test"></p> <p class="t_test">クリックしましょう</p> //以下にドラックアンドドロップの機能。
[.js] $(document).ready(function(){ $(".t_test").css({'color':'yellow'}); $("p.anime_test").delay(2000).animate({'background-color':'red'},2000); //この部分だけが動かない。エラーも何も出ない。 $("p.t_test").on('click', function(){ $("p.t_test").css({'color':'red'}); }); });
試したこと
①.jsにp要素を表記したり、spanに変更してみた。
②html.erbの外部ライブラリ(script部分)を最後の行に移動→エラー。ドラックアンドドロップが定義されてないと表示。今の位置に戻すと、エラー消えるけどonメソッドは使えない。
③gemのturbolinksが悪さをする噂を聞き、外してみるけど、結果は変わらない。
④.onを.clickに書き換えたけれど、動かない。
補足情報(FW/ツールのバージョンなど)
アニメーションなどは動くのに、なぜonとクリックがダメなのか。。。ドラックアンドドロップを入れると、マウス操作にこのような制約が出るものなのでしょうか??
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。