加载页而不刷新

Question

我脑子里有个剧本：

<script>
    $(document).ready(function() {
        $('#nav a').click(function(e) {
            e.preventDefault();
            $('#content').load($(this).attr('href'));
        });
    });
</script>

关于剧本的这一部分

   <div class="dropdown-menu" id="nav">
      <a href="../exercises/match_pinyin.php" class="dropdown-item" >Profile</a>

效果很好。这意味着它在不刷新整个页面的情况下加载php页面。

现在我需要让它和

       <div id="submenu-2" class="collapse" id="nav">
            <ul class="nav nav-small flex-column">

              <li class="nav-item">
                <a class="nav-link" href="../exercises/match_pinyin.php">Γραπτές Ασκήσεις</a>
              </li>

              <li class="nav-item">
                <a class="nav-link" href="pages-utility.html">Utility Pages</a>
              </li>

              <li class="nav-item">
                <a class="nav-link" href="pages-layouts.html">Layouts</a>
              </li>

            </ul>
          </div>

我也尝试了下面的，但它加载到一个新的页面。

<script>
    $(document).ready(function() {
        $('#nav ul li a').click(function(e) {
            e.preventDefault();
            $('#content').load($(this).attr('href'));
        });
    });
</script>

知道我该怎么做吗？

Answer 1

$('#nav a, .nav-link').click成功了，现在看起来不错了。

谢谢