單擊子導航標題上的按鈕時如何重定向到另一個頁面？

Question

我正在使用 Flask、HTML、CSS 和 JS 來構建網站。 我有一個導航欄，它有一個指向其他鏈接的下拉菜單。 您可以在此處查看圖像 - [我的導航圖像][1] [1]：https://i.stack.imgur.com/bF6no.png

如您所見，它有我的子菜單，但是當我單擊“讓我們說一下”時，它不會將我重定向到另一個頁面。

這是我的 html/js：

<div class="navbar">
  <a href="{{url_for('home_page')}}">Home</a>
  <div class="subnav">
    <button id="myButton" class="subnavbtn">About <i class="fa fa-caret-down"></i></button>
    <div class="subnav-content">
      <a href="#company">About US</a>
        <a href="#company">PCU Vision</a>
        <a href="#company">Why PCU?</a>
      <a href="#team">Contact</a>
    </div>
  </div>
    <script><script type="text/javascript">
    document.getElementById("myButton").onclick = function () {
        location.href = "{{url_for('home_page')}}";
    };
</script>

我創建了一個名為 myButton 的函數，所以當我只單擊“關於”按鈕時，它會將我重定向到另一個頁面，但無濟於事？

我是 HTML 和 js 的新手，所以任何想法或建議都會有所幫助。

Answer 1

要在單擊“關於”按鈕時重定向到頁面，請在文本前使用“href”。 像這樣：

<button id="myButton" class="subnavbtn"><a href="company.html" style="text-decoration: none;">About<i class="fa fa-caret-down"></i></button>

完整代碼：

<div class="navbar">
  <a href="{{url_for('home_page')}}">Home</a>
  <div class="subnav">
    <button id="myButton" class="subnavbtn"><a href="https://stackoverflow.com" style="text-decoration: none;">About<i class="fa fa-caret-down"></i></button>
    <div class="subnav-content">
      <a href="#company">About US</a>
        <a href="#company">PCU Vision</a>
        <a href="#company">Why PCU?</a>
      <a href="#team">Contact</a>
    </div>
  </div>
  <script type="text/javascript">
    document.getElementById("myButton").onclick = function () {
        location.href = "{{url_for('home_page')}}";
    };
  </script>