jQueryで下層ページからTOPページに遷移させた先で位置調整が効かない

headerを全ページ共通で読み込み、下層ページからTOPページに遷移させた際にvar adjust = -100;で位置調整をしたいのですが、そもそもjsの記述が発火していないように思われます。
TOPページ内ではjsが走るのですが、下層→TOPに移動した際にも動くようにするにはどうすれば良いでしょうか？
index.jsは遷移前/遷移後両方のページで読み込んでいます。

共通で読み込んでいるheader

header.pug
1ul.navList
2  li.navList__item: a(href="/#section01") section01
3  li.navList__item: a(href="/#section02") section02
4  li.navList__item: a(href="/#section03") section03

TOPページでは位置調整してくれるが下層ページから遷移すると動かない

index.js
1    $('a[href^="/#"],a[href^="#"]').on('click', function () {
2        href = $(this).attr('href').replace(/.*(#.*)/g, '$1');
3        console.log(href);
4        if (href === '#' || href === '') {
5            target = $('html');
6        } else {
7            target = $(href);
8        }
9        var adjust = -100;
10        position = target.offset().top + adjust;
11        console.log(position);
12        $('body, html').animate({
13            scrollTop: position
14        }, 800, 'swing');
15        return false;
16    });

Lhankor_Mhy

2022/04/30 03:05

index.js の読み込みに失敗している、ということはないですか？

fuel330

2022/04/30 03:50

検証ツールで確認してみましたが、読み込みは出来ていました。

Lhankor_Mhy

2022/04/30 03:56

イベントの設定がされていると、検証ツールで[event]というマーカーが出ると思いますが、それはどうですか？また、イベントが発火していることは確認済みですか？

Lhankor_Mhy

2022/04/30 04:29

あ、[event]と出るのはFirefoxの検証ツールでした。失礼しました。

fuel330

2022/04/30 08:15

ひとまず下記の記述でconsoleが表示されるかどうかチェックしたのですが、TOPページではconsoleが表示され、下層→TOPページではされませんでした。 $('a[href^="/#"],a[href^="#"]').on('click', function () { console.log(“test”); }); よってイベントそのものが発火していないということですが、ページ遷移後にイベントを発火させるにはどうすれば良いのでしょうか？

Lhankor_Mhy

2022/04/30 08:24

console.log(“test”); $('a[href^="/#"],a[href^="#"]').on('click', function () { こうするとどうですか？

Lhankor_Mhy

2022/04/30 08:36

もしかして、Ruby on Rails ですか？

Lhankor_Mhy

2022/04/30 09:01

もし、Ruby on Rails で turbo links を使っているならば、それが原因かもしれないです。私は全く詳しくないので、質問と質問タグを編集して、Rails に詳しい回答者に見てもらった方がいいかもです。

fuel330

2022/04/30 13:16

Ruby on Railsではありません。clickイベントが発火しているか否かを確認するためのconsoleですので、当然外に出せば出力されますが、それでは意味がないです。