javascript - javascript: 画像と onClick を入れ替える

Question

<img src="logo.jpg" class="myImage" alt="Logotyp" />

これは私のJavaScriptコードです:

$(function() {
    var windowWidth = $(window).width();
    if (windowWidth <= 480) {
        $(".myImage").attr("src", "load.jpg");
    }
});

window width = 480 の場合、イメージ logo.jpg は load.jpg になります。正常に動作します。しかし、load.jpg をクリックすると再び logo.jpg になるという onClick 関数が必要です。うまくいかないようです。提案？

Answer 1

$(".myImage").click(function(){
   $(this).attr("src"," logo.jpg"); 
});

Answer 2

jsBin デモ

あなたはできる：

• 変数を作成するwindowWidth
• var 値changeImg()に応じて変換を処理する関数 " " を作成します。windowWidth
• changeImg()必要な場所で関数を使用するよりも、 内でも実行できる$(window).resize()ため、変更は手動のサイズ変更にも適用されます。
• クリックするよりも、乱暴に振る舞うよりも、windowWidth をだまして巨大な数値を設定し、changeImg関数を呼び出します。楽しい。

jQuery:

$(function() {
  
  var windowWidth = $(window).width();
  
  function changeImg(){
     if (windowWidth <= 480) {
        $(".myImage").attr("src", "http://www.rockettheme.com/distribution/download/file.php?avatar=63759_1251026504.jpg");
     }else{
        $(".myImage").attr("src", "http://screenshots.en.sftcdn.net/blog/en/2009/12/2t_firefox-logo.jpg");
     }
  }
  changeImg();
  
  $(window).resize(function(){
    windowWidth = $(window).width(); // grab width while resizeing
    changeImg();
  });
  
  $('img[alt=Logotyp]').on('click', function(){
    windowWidth = 9876; // we fool the windowWidth
    changeImg();    // we play dead and call our function :D
  });
  
});

Answer 3

function myAlert() { alert("heelo wrold") };

$(.myImage).setAttribute ("onclick", "myAlert()");

これを試したことはありませんが、正しいようです。〜ベン