Ajax Javascript: ссылка не работает

Question

На сайте Sharepoint у меня есть навигация, которая содержит return AjaxNavigate$OnClickHook(event, this);, Также есть "нормаль" <a href="..."> -тег за ссылку.

Теперь связанный контент изменяется, добавляя изображение внутри тега ссылки.

Изображение отображается в правой позиции, курсор также показывает ссылку, которую можно открыть с помощью контекстного меню, вызываемого правой кнопкой мыши, и выбрать "Открыть ссылку" или "Открыть ссылку в новой вкладке". Но он не открывается при нажатии "нормально".

Я предполагаю, что код Ajax выше препятствует нормальной обработке ссылок. Как я могу сделать так, чтобы изображение было правильно связано?

Благодарю.

изменить: релевантный HTML (генерируется в основном сайтом Sharepoint):

(...)

<div 
  class="ms-displayInline ms-core-navigation" 
  id="DeltaTopNavigation" 
  role="navigation"
  >

  <div 
    class=" noindex ms-core-listMenu-horizontalBox" 
    id="zz13_TopNavigationMenu" 
    onclick="return AjaxNavigate$OnClickHook(event, this);"
    >
    <ul 
      class="root ms-core-listMenu-root static" 
      id="zz14_RootAspMenu"
      >
      <li class="static selected">
        <a 
          tabindex="0" 
          class="static selected menu-item ms-core-listMenu-item ms-displayInline ms-bold ms-core-listMenu-selected ms-navedit-linkNode" 
          accesskey="1" 
          href="https://xxx/sites/00001/SitePages/SomeSite.aspx"
          >
          <span class="additional-background ms-navedit-flyoutArrow">
            <span 
              class="menu-item-text" 
              style="text-align: center; display: inline-block; position: relative;"
              >
              <img 
                style="width: 50px; height: 50px;" 
                src="/sites/00001/SiteAssets/images/pic.png" 
                border="0"
                >
              <br>Text
            </span>
            <span class="ms-hidden">Currently selected</span>
          </span>
        </a>
      </li>
      <li class="static">
        <a 
          tabindex="0" 
          class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" 
          href="https://xxx/sites/00001/SitePages/SomeSite2.aspx"
          >
          <span class="additional-background ms-navedit-flyoutArrow">
            <span 
              class="menu-item-text" 
              style="text-align: center; display: inline-block; position: relative;"
              >
              <img 
                style="width: 50px; height: 50px;" 
                src="/sites/00001/SiteAssets/images/pic2.png" 
                border="0"
                >
              <br>Text 2
            </span>
          </span>
        </a>
      </li>
    </ul>
  </div>

</div>

(...)

РЕДАКТИРОВАТЬ 2: <img... -tag вставляется впоследствии, с помощью этого кода:

 $('[id$="RootAspMenu"]').find('.menu-item-text').each(function(i,item)
  {
   var iconName = "pic_";
   iconName += $(item).text().replace(" ","").toLowerCase();
   iconName += ".png";
   $(this).prepend('<img style="width:50px;height:50px;" src="/sites/00001/SiteAssets/images/'+iconName+'" border="0"><br/>');
 
   $(this).css("display", "inline-block");
   $(this).css("position", "relative");
   $(this).css("text-align", "center");
  }
 );

... и я заметил, что область "позади" изображения (так, <span> площадь?) связана правильно. Только изображения нет.

Может ли быть проблемой для ссылки, что изображение было вставлено впоследствии? Как я могу решить эту проблему?

Answer 1

Я получил это сам!

Вставляя в скрипт /jquery, куда я вставляю изображение, я также помещаю это:

if ($(this).parent().is("span") ) {
  $(this).unwrap();
}

... забирает <span> вокруг изображения / внутри ссылки. Теперь это работает правильно!