Jquery Bread Crumb

Question

我按照本教程为我的网页创建面包屑路径。点击面包屑路径时，链接会进入相应的页面。但是，从导航部分点击时，相同的链接不起作用（停留在同一页面上） - 请参阅URL test1.html和test2.html - 。

这是脚本：

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
    <script>
        $('.items a').on('click', function () {
            var $this = $(this),
                $bc = $('<div class="item"></div>');

            $this.parents('li').each(function (n, li) {
                var $a = $(li).children('a').clone();
                $bc.prepend(' / ', $a);
            });
            $('.breadcrumb').html($bc.prepend('<a href="#home">Home</a>'));
            return false;
        })
    </script>

...这是HTML /导航链接：

  <div class="breadcrumb">
        <div class="item"><a href="index.html">Home / </a></div>
    </div>

    <div class="items">
        <ul>
            <li><a href="test1.html">Test 1</a></li>
            <li>
                <a href="test2.html">Test 2</a>
                <ul>
                    <li><a href="level1">Level 1</a></li>
                    <li>
                        <a href="level2">Level 2</a>
                        <ul>
                            <li><a href="level3">Level 3</a></li>
                            <li><a href="level4">Level 4</a></li>
                        </ul>
                    </li>
                </ul>
            </li>
            <li><a href="#test1">Test 3</a></li>
        </ul>
    </div>

...面包屑中的链接在点击时会进入相应的页面;问题是，在导航部分单击时，相同的链接不起作用。我可以得到一些关于我做错了什么的帮助吗？