ошибка HTML5?подробнее> резюме> Я помечаю шрифтом потрясающую ссылку, не кликабельную

Question

Если щелкнуть по удивительному элементу шрифта внутри тега, встроенного в тег сводки сведений, следует перейти по ссылке, а тег подробностей фиксирует событие клика.Это ожидаемое поведение (я бы так не думал) или ошибка в HTML5?

<details>
 <summary>
  Details
  <a href="http://google.com">
   <i class="glyphicon glyphicon-plus"></i>
    Visit Google
  </a>
 </summary>
 <p> The Searching Site</p>
</details>

пример: https://codepen.io/anon/pen/GGgyNz Примечание. Я думаю, что codepen переопределяет внешние ссылки, но вкладка сведений должнане запускается при нажатии на тег Font Awesome

Incase Pen не работает, полный HTML:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="container">
  <h2>Details Tag and Font Awesome Link Issue</h2>
  <details>
    <summary>
      Details
      <a href="http://google.com">
        <i class="glyphicon glyphicon-plus"></i> Visit Google
      </a>
    </summary>
    <p> The Searching Site</p>
  </details>
</div>

Answer 1

function changeLocation() {
  window.location = "www.google.com";
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="container">
  <h2>Details Tag and Font Awesome Link Issue</h2>
  <details>
    <summary>
        Details
        <span onclick="changeLocation()">
          <a>
            <i class="glyphicon glyphicon-plus"></i>
            Visit Google
          </a>
        </span>
    </summary>
    <p> The Searching Site</p>
  </details>
</div>

I-тег будет недоступен для прямого нажатия, если вы включите его в тег привязки.Событие 'onclick' сделает всю работу за вас.