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/

无法显示更新的图像

3 个答案: