特定のページに遷移したときにjqueryを発火させたい

Question

現在、youtubeの動画アップロードのようにモーダルウインドウを表示して、ファイルを選択してから、次の画面に行くような機能を実装しようとしています。
そこで、jqueryで処理をかいているのですが、モーダルウィンドウが表示されるトリガーをうまく設定できません。
songs/new.html.erbにページ遷移をすると、モーダルウィンドウが表示されるといった形にしたいです。
jqueryでリンクを取得し、そのリンクのページが読み込まれたときに処理を流すには
どう記述したらいいのでしょうか。
回答をよろしくお願いします。

document.addEventListener(
  "DOMContentLoaded", e => {
    let modal_open = document.getElementById("modal-open-btn");
    modal_open.onclick = function () {
      $('#overlay').fadeIn();
      document.getElementById('modal-close-btn').onclick = function () {
        $('#overlay').fadeOut();
      };
      document.getElementById("delete-comformation-btn").onclick = function () {
        document.getElementById("song-delete-btn").click();
      };
    };
  },
  false
);

Comments

[maisumakun]

Turbolinksは使っていますか？

[smilax630]

使っていません

[maisumakun]

モーダルの表示には何を使っていますか？

[smilax630]

別の部分で使用した、モーダルの表示をするコードを追加しました。これを応用して実装しようと考えていました。

[hoshi-takanori]

「モーダルの表示には何を使っていますか？」という質問に「別の部分で使用した、モーダルの表示をするコードを追加しました。」と答えても情報量ゼロです。これでは誰にもアドバイスしようがありません。

「特定のページに遷移したときに」とありますが、そもそも Web のページ遷移の仕組みは理解されてますか？ songs/new.html.erb が独立したページなら jQuery なんか使わなくても静的にモーダルを配置すればいいことになりますが、なんか違う気がするし。他人の書いたコードをコピペするだけでなく、Web がどういう仕組みで動いてるか勉強して、コードがどう動いてるかをちゃんと理解して利用することをお勧めします。