1

编辑：为了清楚起见，我有问题的不是 jsfiddle。这在所有浏览器中对我来说都很好，它是我网站上的实际实现，它使用下面的确切代码。

我在一个页面上有一个由 8 个动态生成的 YouTube 缩略图和一个播放器 div 组成的块。当我单击其中一个缩略图时，我希望关联的视频在播放器 div 中进行 ajaxly 播放。以下代码适用于 FF，但不适用于 IE 或 Chrome。

$(document).ready(function(){


    $('.vidlink').click(function (event) {
            event.preventDefault();
            var addressValue = $(this).attr("href");
            alert(addressValue);

            iFrame = "<iframe width=\"560\" height=\"315\" src=\"http://www.youtube.com/embed/"+addressValue+"\" frameborder=\"0\" allowfullscreen></iframe>";


            newDiv = "<div id=\"vidPlayer\">" + iFrame + "</div>";


            $('#vidPlayer').replaceWith(newDiv);

        });

});

这几乎就是我想要做的（JSFiddle）。

在我将双引号周围的双引号更改为单引号之前，它在 FF 中也不起作用$('.vidlink')。我试过了，$(this).attr("href")但在 FF 上又把它弄坏了。

4

3 回答 3

3
  • 代码看起来不错
  • 控制台吐出没有错误
  • 在 JSFiddle 中工作
  • 引号似乎有所作为（完全不可能，这对我来说是尖叫：“你找错地方了！”）

检查事项：

  • 退后一步看看周围的代码可能是值得的
  • 确保没有可能解除您的事件绑定的代码。如果有，在其周围设置一些debuggers/breakpoints/console.log
  • 在事件函数中设置一些debuggers/breakpoints/console.log
  • 确保您的文件没有被缓存。如果您的 JavaScript 在外部文件中，我要做的另一件事是直接导航到该文件并在那里进行缓存刷新。
  • 确保您正在查看您网站的正确版本（例如，不编辑本地版本，然后查看外部版本）
  • 回顾你对你认为正在发生的事情的所有假设

我 99% 确定问题不在于您发布的代码。我认为您所遇到的错误是其中之一，当它最终起作用时，您将永远捂着脸并在晚上失眠。我们都这样做！

于 2013-05-09T01:28:58.960 回答
1

它在 FF、Chrome 和 IE 中为我工作。单引号或双引号不应该有任何区别。你认为它确实让我认为你没有正确测试的事实。确保清除每个浏览器中的缓存。或者至少在你决定它是否正常工作之前点击刷新几次。

于 2013-05-09T01:23:19.953 回答
0

尝试使用 Youtube API 很容易包含一个视频，从而避免错误。

可以在https://developers.google.com/youtube/iframe_api_reference#Getting_Started中找到一个简单的示例

于 2013-05-09T02:25:18.930 回答