Значки SVG исчезают в Windows 10 IE 11, используя сортировку jQuery

У меня возникает очень странная проблема, которая возникает только в Internet Explorer 11 в Windows 10. Когда сортировка jQuery останавливается, значок SVG внутри элемента списка становится невидимым. Прекрасно работает в Chrome и Edge, и это, похоже, не проблема стиля. Мне удалось создать этот простой скрипт, чтобы показать проблему как можно более основную.

http://jsfiddle.net/UAcC7/1666/

<svg>
   <use xlink:href="#icon-add" />
</svg>

$("#sortable").sortable();

Ответы

Ответ 1

Чтобы исправить эту ошибку, вам нужно вручную обновить значение xlink: href для используемого тега svg каждый раз, когда оно добавляется на страницу. Просмотрите этот другой пост в с помощью jquery, чтобы изменить атрибут xlink: href элементов svg для получения дополнительной информации о том, почему это работает.

Лучший способ обновить атрибут - использовать метод сортировки jquery sortable stop. Вот jsFiddle, который работает: http://jsfiddle.net/t25hyyso/4/

$("#sortable").sortable({
  stop: function(event, data) {
    useElement = data.item[0].getElementsByTagName("use")[0];
    if (useElement.href && useElement.href.baseVal) {
      useElement.href.baseVal = useElement.href.baseVal; // trigger fixing of href
    }
  }
});