IE / Edge单击SVG会导致错误 - TypeError：Object不支持属性或方法'blur' [英] IE/Edge click on SVG causes error - TypeError: Object doesn't support property or method 'blur'

问题描述

我正在使用角度组件（Angular UI分页，虽然我不认为这是问题的原因），我的模板包含以下内容......

I'm using an angular component (Angular UI pagination, although I don't think it's the cause of the problem), and my template includes the following...

<my-button ng-click="selectPage(totalPages, $event)">
    <svg>
        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="domain.com/scgSprite.svg#arrow"></use>
    </svg>
</my-button>

问题是在MS Edge和IE（但不是chrome）中我点击时出现以下错误按钮。

The problem is that in MS Edge and IE (but not chrome) I get the following error when clicking the button.

TypeError：对象不支持属性或方法'模糊'

当我点击按钮但没有图标的边缘时，不会发生这种情况。我必须实际点击按钮上的SVG元素才能得到错误。

It doesn't happen when I click on the button but on the edge where there is no icon. I have to actually click the SVG element on the button to get the error.

任何帮助都会非常感激。

Any help would really be appreciated.

编辑：

我发现angular-ui库中导致错误的行是这些...... 。

I have since found out that the lines in the angular-ui library that is causing the error are these...

if (evt && evt.target) {
    evt.target.blur();
}

我不想编辑库因为那样我就不会了能够在将来将它更新到更新版本。

I don't want to edit the library because then I won't be able to update it to newer versions in the future.

我是否有可能将.blur（）函数添加到MS浏览器中的svg元素？

Is there a possibility I could add the .blur() function to svg elements in MS browsers?

推荐答案

这解决了问题

if (typeof SVGElement.prototype.blur == 'undefined') {
    SVGElement.prototype.blur = function(){};
}

这篇关于IE / Edge单击SVG会导致错误 - TypeError：Object不支持属性或方法'blur'的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！