Question

我在application.js文件中有这个代码，但它似乎不起作用：

$("#video_div img").click(function() {
   $("div.embed").toggle();
});

这是我的浏览器看到的HTML：

<div id="video_div">
<img src="http://i3.ytimg.com/vi/fTWpHknumdg/hqdefault.jpg" style="width: 200px; ">
<div class="embed">
<object width="300" height="194"><param name="wmode" value="opaque"><param name="movie" value="http://www.youtube.com/v/fTWpHknumdg?version=3">
<param name="allowFullScreen" value="true">
<param name="allowscriptaccess" value="always">
<embed src="http://www.youtube.com/v/fTWpHknumdg?version=3" type="application/x-shockwave-flash" width="300" height="194" allowscriptaccess="always" allowfullscreen="true" wmode="opaque">
</object>
</div>
</div>

现在，我正在使用div.embed隐藏div.embed { display: none;}元素，但点击方法不会再次重新显示该元素...

Answer 1

你的代码被调用了吗？你需要这样做吗？

$(document).ready(function () {
    $("#video_div img").click(function() {
        $("div.embed").toggle();
    });
});

Answer 2

这对我有用。你确定你加载了jQuery。确保您的jquery.js位于结束正文标记</body>

之前

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.min.js" type="text/javascript"></script>

检查http://jsfiddle.net/Ey4YC/

处的工作示例

如果您想将jquery.js保留在标题中，也可以尝试这样的代码。

$(function() {
    $("#video_div img").click(function() {
        $("div.embed").toggle();
    });

Answer 3

我的猜测是Flash错误。尝试相同的代码，但这次当你点击图像然后调整浏览器大小。

最近我的firefox和chrome通常不会渲染youtube的vdo（vdo只是白色就像没有加载）但是在我调整浏览器窗口后它会出现。

为什么这个jquery代码不起作用？

3 个答案:

检查http://jsfiddle.net/Ey4YC/