Javascript 通过更改图像src切换图像

Javascript 通过更改图像src切换图像,javascript,Javascript,我希望通过点击按钮在图像之间切换,但它似乎不起作用。下面的代码有什么问题吗 var paper = new Raphael(document.getElementById("mySVGCanvas")); var image1 = paper.image("https://tromoticons.files.wordpress.com/2012/11/y-u-no.png?w=350&h=300&crop=1", 10, 10, 100, 100); var myState

我希望通过点击按钮在图像之间切换,但它似乎不起作用。下面的代码有什么问题吗

var paper = new Raphael(document.getElementById("mySVGCanvas")); 

var image1 = paper.image("https://tromoticons.files.wordpress.com/2012/11/y-u-no.png?w=350&h=300&crop=1", 10, 10, 100, 100);

var myState = 0

button1.node.addEventListener('click', function(){
        console.log("this part is working...");
        if (myState === 0){
            myState = 1;
            image1.src = "http://www.sherv.net/cm/emoticons/trollface/success-troll-smiley-emoticon.png"

        } else{
            myState = 0;
            image1.src = "https://tromoticons.files.wordpress.com/2012/11/y-u-no.png?w=350&h=300&crop=1"

            };
        }
编辑:

即使Raphael方法
image()
确实在Raphael对象内创建了,并且该元素上没有src属性,这意味着您应该使用
image1.node.setAttributes(“http://www.w3.org/1999/xlink“,'href',yourSrc)
,拉斐尔方法
attr('src','yourSrc')
会处理它:

var-paper=Raphael(0,0,500,200);
var image1=纸张图像(“https://tromoticons.files.wordpress.com/2012/11/y-u-no.png?w=350&h=300&crop=1", 10, 10, 100, 100);
var myState=0;
var button1=纸圈(10,10,20);
按钮1.属性(“填充”,“f00”);
button1.node.addEventListener('click',function(){
如果(myState==0){
myState=1;
图1.attr('src',”http://www.sherv.net/cm/emoticons/trollface/success-troll-smiley-emoticon.png");
}否则{
myState=0;
图1.attr('src',”https://tromoticons.files.wordpress.com/2012/11/y-u-no.png?w=350&h=300&crop=1");
}
},假)

改为使用类,并使用
背景图像
和切换类不设置myState=0;