jquery - 无法显示更新的图像

Question

我有以下代码：

jQuery

$("document").ready(function(){
    var imglink;
    imglink = 'url("http://poweruser.aeiou.pt/wp-content/uploads/2012/12/google.jpg")';
    $('#trick_img').css('content',imglink);

    $(document).on("click","change",function(){
        imglink = 'url("http://poweruser.aeiou.pt/wp-content/uploads/2012/12/Google-Gmail.jpg")';
        $('#trick_img').css('content',imglink);
    });

});​

HTML

<image id="trick_img" draggable="false"/><br/>
<button id="change">Change image</button>​

CSS

img#trick_img { margin:10px; }

测试链接 http://jsfiddle.net/Y5jA9/

我的问题是：如何改变屏幕上的图像？

Answer 1

这一行：

$(document).on("click","change",function(){

应改为：

$(document).on("click","#change",function(){

按 id 引用“更改图像”按钮

Answer 2

$(document).on("click","#change",function(){
        imglink = 'http://poweruser.aeiou.pt/wp-content/uploads/2012/12/Google-Gmail.jpg';
        $('#trick_img').attr('src',imglink);
    });

Answer 3

 $(document).on("click","#change",function(){
        var imglink;
        imglink = 'http://poweruser.aeiou.pt/wp-content/uploads/2012/12/Google-Gmail.jpg';
        $('#trick_img').attr('src',imglink);
    });

尝试这个

http://jsfiddle.net/Y5jA9/3/