Question

我有这个div：

<div class="main_mark">
    <img src="/assets/welcome_main.png" alt="main" class="main_mark_image" />
</div>

我想要下一件事：当用户点击图片时，此div将更改为：

<div class="main_mark">
    <embed width="420" height="345" src="http://www.youtube.com/v/XjR-4lbK1mI" type="application/x-shockwave-flash">
    </embed>
</div>

所以在我的javascript中，我尝试过这样的事情：

$(".main_mark_image").click(function () {
    $("#main_mark").innerHTML = "<embed width=420 height=345 src=http://www.youtube.com/v/XjR-4lbK1mI type=application/x-shockwave-flash></embed>";
});

但它没有改变任何东西......

任何帮助都得到了回报！

Answer 1

$(".main_mark").html("Your code")代替$("#main_mark").innerHTML

Answer 2

main_mark是一个不是id的类。使用.main_mark

Answer 3

使用html功能：http://api.jquery.com/html/

$(".main_mark_image").click(function () {
    $("#main_mark").html("<embed width=420 height=345 src=http://www.youtube.com/v/XjR-4lbK1mI type=application/x-shockwave-flash></embed>");
});

Answer 4

使用@sdespont和@ kmd97

的组合

$(".main_mark_image").click(function () {
// Changed selector to class
$(".main_mark").html("<embed width=420 height=345 src=http://www.youtube.com/v/XjR-4lbK1mI     type=application/x-shockwave-flash></embed>");
});

Answer 5

尝试：

$(".main_mark_image").click(function () {

    $(".main_mark").html = "<embed width=420 height=345 src=http://www.youtube.com/v/XjR-4lbK1mI     type=application/x-shockwave-flash></embed>";
    });

单击图像更改div内容

5 个答案: