Question

我试图通过点击切换这些图片。 javascript直接来自mozilla教程，所以我不确定为什么它不起作用，什么都没发生。我正在开发cloud9。

我的HTML：

<img id="swagBunny" src="images/large.jpg" height="150" width="186" alt="Swaggy Bunny"/>

我的Java脚本：

var myImage = document.querySelector('img');

$(function(){ 
   myImage.onclick = function() {
        var mySrc = myImage.getAttribute('src');
        if(mySrc === 'images/large.jpg') {
            myImage.setAttribute ('src','images/images.jpg');
         } else {
            myImage.setAttribute ('src','images/large.jpg');
         }
   };
});

Answer 1

不知道为什么它不起作用。以下是您使用JavaScript的工作示例：

＆＃13;

$(function(){ 
   var myImage = document.querySelector('img');
   myImage.onclick = function() {
        var mySrc = myImage.getAttribute('src');
        if(mySrc === 'http://static.tumblr.com/1bd1b615e6da70dd71dc84fd2f47c80d/zpmncfu/oxNng9hfv/tumblr_static_95p88l86si88ks4w4wws04wk8.png') {
            myImage.setAttribute ('src','https://cdn-insomniac.s3.amazonaws.com/emoji_sexface.png');
         } else {
            myImage.setAttribute ('src','http://static.tumblr.com/1bd1b615e6da70dd71dc84fd2f47c80d/zpmncfu/oxNng9hfv/tumblr_static_95p88l86si88ks4w4wws04wk8.png');
         }
   };
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="http://static.tumblr.com/1bd1b615e6da70dd71dc84fd2f47c80d/zpmncfu/oxNng9hfv/tumblr_static_95p88l86si88ks4w4wws04wk8.png" alt="Smiley face" height="42" width="42">

＆＃13;

使用javascript切换图像

1 个答案: