Javascript 标记的数据属性在Chrome中更改时不会刷新

我在一个网页上有一个标记，它的数据属性在JS jQuery中以编程方式更改。数据标记始终指向SVG图像

在Firefox中，当数据标签更改时，会加载新的SVG并触发所有适当的事件。在Chrome中，在我单击SVG画布之前不会发生这种情况——一旦发生这种情况，新的SVG将显示并触发所有相关事件

为什么会这样？当我改变Chrome的数据属性时，我怎么能强迫它刷新它呢？

好吧，今晚我真的很无聊，我想做一些不是功课的事情，所以我为你翻阅了很多规范和论坛

这篇文章似乎没有提到SVG，因此有一条死胡同。它告诉我们可以使用数据来调用插件和加载内容。SVG不支持SVG，这告诉我们SVG属于

由于在中定义的元素中添加了额外的细节，因此可以说加载元素的行为不是公认的标准。如果我错了，请有人纠正我

无论如何，在规范中，除了所有关于浏览器应如何通过MIME类型等解释对象的常用技术术语之外。。。我们发现与此问题相关的部分：

4.6：如果加载失败，例如出现HTTP 404错误、DNS错误，则在元素处触发一个名为error的简单事件，然后跳到整个步骤回退集中的最后一步

10.：资源完全加载后，将任务排队，以便在元素处触发名为load的简单事件

仅仅意味着事件不会冒泡，因此我们无法在任何父元素中侦听它，并且不可取消，并使用事件接口

因此，看看这个，我认为如果我从DOM中选择元素，它应该有一个onload和onerror事件，如果不是object.addEventListener的话。如果您查看Mozilla开发者网络文档中的和，大部分JavaScript文档都是不完整的。糟糕透了

我只是闲逛了一下JSFIDLE、Chrome开发工具和Firefox Web控制台，发现它们都支持onload和onerror，至少我是这么认为的

测试结果 Google Chrome 18.0.1025.165和Firefox 12.0 支持：

addEventListener'load'，函数{} obj.onload=函数{}； 不支持事件似乎不触发：

addEventListener'error'，函数{} obj.onerror=函数{} 从中可以看到，在Chrome中使用load事件会导致无限循环。根据以下规定，不应这样做：

上述算法独立于CSS属性，包括“显示”、“溢出”和“可见性”。例如，即使元素使用“display:none”CSS样式隐藏，它也会运行，如果元素的可见性发生变化，它不会再次运行

它看起来像某个人，所以如果你去确认这个bug，它将帮助Chrome开发者团队

TL；博士

---

加载对象的行为还不是公认的标准，但您可以去验证。您可以尝试按照@Hello71的建议进行操作，尝试从DOM中删除元素并重新添加，但是。

我已经尝试了很多方法。不幸的是，我不得不采取以下措施：

setTimeout(function(){
  $('body').trigger('click');
}, 40);

---

不，我没有更好的解决方案，但它完成了任务。

事实上，我也遇到了同样的问题。看一下，我用以下代码解决了它：

html：

<object id="graph" data="image1.svg" type="image/svg+xml"></object>

这对我很有用

铬24.0.1312.52米 Firefox17.0.1

---

希望有帮助

我只是想发表评论并说声谢谢：-我有几个备选方案，我将在下一步尝试。这似乎在2017年5月的补丁中得到了修复，但截至2017年12月，没有发生任何事情。有点骇客，但有时这是最好的解决方案……事实上我不知道这现在是否奏效了，哈哈。真是一个皮塔。我尝试的任何解决方案的结果都不一致。这对我来说不起作用，我认为这是因为它实际上是将URL的内容放在元素中，而不是将数据属性设置为URL。

var new_url = 'image2.svg';
$('#graph').attr('data', new_url);
$('#graph').load(new_url);