このjQueryをデバッグできません

Question

私のサンドボックスサイトenglishgodsandboxを見ると、約8秒後に、ページの中央にボタン「確認」が表示されたドロップダウンメニューが読み込まれます。 「確認」ボタンをクリックすると、下のコードの最後の数行に従ってページの背景イメージが変更されます。

しかし、画像は変わっていません...だれか私に理由を教えてもらえますか？

$(document).ready(function(){  
    $(init); 
}); 

function init() { 
    cloudshow(); 
} 
function cloudshow() { 
    $("#intro").fadeIn(1000, function(){ 
     $("#intro2").fadeIn(1000, function(){ 
      $("#cloud1").fadeIn(2000, function(){ 
       $("#cloud2, #cloud5").fadeIn(2000, function(){ 
        $("#cloud3, #cloud4, #cloud6").fadeIn(2000, function(){ 
         $("#message").fadeIn(1000, function() { 
          $("#contactform").fadeIn(1000) 
         }); 
        }); 
       }); 
      }); 
     }); 
    }); 
}; 



var img1 = "url('/wp-content/themes/thesis_18/custom/images/map.jpg') repeat"; 

$(".submit").click(function(){ 
    $("body.custom").css({background: img1}); 
}); 

Answer 1

問題は、彼らが前に$(".submit") elemetsを参照するということですDOMに解析されます。それを赤い出来事に入れたり、体の終わりに置くとあなたの問題は解決します。

$(function() { 
    $(".submit").click(function(){ 
     $("body.custom").css({background: img1}); 
    }); 
}); 

Answer 2

[OK]をクリックします。

最後の3行が実行された時点で、.submitボタンは実際にページにはまだありません。

これらの行をinit()関数に移動し、試してみてください。

init関数は、ドキュメントの準備ができてから実行されるため、その時点でボタンが存在する必要があります。あなたは$は（ "提出する"）ことを確認する必要があります

$(".submit").click(function(){ 
    $("body.custom").css({background: img1}); 
}); 

動作するために

Answer 3

存在するので、試してみてください。

var img1 = "url('/wp-content/themes/thesis_18/custom/images/map.jpg') repeat"; 

$(document).ready(function(){ 
    init(); 

    $(".submit").click(function(){ 
     $("body.custom").css({background: img1}); 
    }); 

});