小编Pau*_*mas的帖子

我遇到了一个有趣的错误(？),如果您使用<use>作为链接的一部分(例如图标)嵌入SVG - 图标本身不会在jQuery中注册click事件,但单击文本会.我认为这是由于SVG事件没有冒泡？

如果直接嵌入SVG,无论是否单击文本或图标,链接都会触发.

我在这里可以看到一个简单的测试用例: SVG <use> bug测试用例.

我在Firefox中使用SVG符号和位置时出现意外行为:绝对值与transform:translate();

这似乎只发生在Firefox中,而不是IE或Chrome.我也有理由相信我之前没有遇到这个问题,所以也许是一个新问题/错误？目前使用43.0.4(Windows)并且还在44.0.2(Linux)中进行了测试.

在这个Plunkr中,我希望地图指针,圆形和方形都位于边界框的中央.但是,在Firefox中,地图指针未正确定位.地图指针是SVG符号.

更新:只有当SVG定位为使用svg {}作为CSS选择器时,问题才会出现.如果通过.icon {}选择器设置样式,它将按预期工作.

码:

#svg-sprite{
  position: absolute;
  width: 0;
  height: 0;
}

.rect{
  position: relative;
  width: 400px;
  height: 400px;
  background: #f00;
}

svg{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 200px;
  height: 200px;
  fill: #fff;
  opacity: 0.5;
}

.circle{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 200px;
  height: 200px;
  background: #0f0;
  border-radius: 50%;
  opacity: 0.5;
}

.square{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 200px; …

我在样式组件中反复收到此错误：类型错误：对象不支持属性或方法“ToString”

styled-components/dist/styled-components.browser.esm.js" line 170 col 1

所以错误似乎发生在包本身而不是我的代码库中。我已经尝试更新到样式组件的最新版本 (3.4.5)，但仍然遇到相同的问题。

它似乎发生在大多数很旧的浏览器（例如 Edge 13）中，但似乎是最新的，仍然可以支持。

我找不到对其他有同样问题的人的任何参考，所以感觉我可能用错了它，但想不出是什么。

当我通过AJAX请求到达页面时,我很难获得HTML5视频.

如果您刷新页面,或直接登陆页面,它可以正常工作.但是当通过AJAX导航到页面时,它无法播放.

代码是:

<video id="video" autoplay="autoplay" loop="loop" muted="muted" poster="http://localhost/wp-content/themes/studioindigo/videos/contactbackground.jpg">
                   <source src="http://localhost/wp-content/themes/studioindigo/videos/contactbackground.mp4" type="video/mp4">
                   <source src="http://localhost/wp-content/themes/studioindigo/videos/contactbackground.webmhd.webm" type="video/webm">
                   <img src="http://localhost/wp-content/themes/studioindigo/videos/contactbackground.jpg" alt="your browser does not support html5 video">
               </video>

我尝试在AJAX页面加载成功时触发以下代码:

video = document.getElementById('video');
    video.load();

    video.addEventListener('loadeddata', function() {
        video.play();
    }, false);

还简单地说:

video = document.getElementById('video');
video.play();

我也尝试过使用像video.js这样的插件,但无济于事.

我不禁想到我错过了一些非常简单的事情.当然,如果视频在页面上并且具有自动播放设置,那么无论您是通过AJAX还是直接到达页面,它都应该播放？

对页面的AJAX请求只更新#main元素(视频在里面)和history.pushState - 这可能与它有什么关系吗？这似乎不太可能......