なぜjquery fadeIn（）は.html（）で動作しませんか？

チェックボックスをクリックすると、メッセージがゆっくりとフェードインします。なぜjquery fadeIn（）は.html（）で動作しませんか？

なぜこの例では.fadeIn（）が機能しませんか？

HTML：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <meta http-equiv="content-type" content="text/html;charset=utf-8"/> 
     <title>Text XHTML Page</title> 
     <link href="css/main.css" rel="stylesheet" type="text/css" media="all"/> 
     <script type="text/javascript" src="http://www.google.com/jsapi"></script> 
     <script type="text/javascript" src="javascript/main.js"></script>  
    </head> 
<body> 
    <div class="checkboxList"> 
     <div class="title">Languages:</div> 
     <div class="row"><input class="checkbox" type="checkbox"/><span class="label">Ruby</span></div> 
     <div class="row"><input type="checkbox"/><span class="label">PHP</span></div> 
     <div class="row"><input type="checkbox"/><span class="label">C#</span></div> 
     <div class="row"><input type="checkbox"/><span class="label">Python</span></div> 
     <div class="row"><input type="checkbox"/><span class="label">JavaScript</span></div> 
    </div> 
    <p id="message"></p> 
</body> 
</html>

のjavascript：

google.load("jquery", "1.3.2"); 

//run when page is loaded 
google.setOnLoadCallback(function() { 

    $('.checkboxList .row').css('color','red'); 
    $('.checkboxList input').attr('checked', true); 
    $('.checkboxList input').bind('click', function() { 
     $('#message').html("You clicked on a checkbox.").fadeIn('slow'); 
    }); 

});

出典

2009-09-29 Edward Tanguay

198

#message要素が表示されているので、ノーフェードインが行われ、それを隠す、コンテンツを追加し、それをフェード：

$('#message').hide().html("You clicked on a checkbox.").fadeIn('slow');

出典

2009-09-29 04:33:52 CMS

パーフェクト、ちょうど私が必要なもの。 – Phil

あなたは今日のヒーローです。 –

人間の形のコンテンツ管理システム - すばらしい！ – JoseBazBaz

私はトラブルの前に、この連鎖を持っていた理由が、全く分かりません。あなたはこのあまりエレガントなコードを使用することにより、必要な効果を得ることができます。

google.load("jquery", "1.3.2"); 

//run when page is loaded 
google.setOnLoadCallback(function() { 

    $('.checkboxList .row').css('color','red'); 
    $('.checkboxList input').attr('checked', true); 
    $('.checkboxList input').bind('click', function() { 
     $('#message').hide(); //just in case 
     $('#message').html("You clicked on a checkbox."); 
     $('#message').fadeIn('slow'); 
    }); 

});

出典

2009-09-29 04:33:31 beggs

をフェードインを使用するように働く私のコードであり、あなたは知っていますか？同様に、連鎖は機能しますが、試してみたときに見逃したことが多かったので、元の方法に戻りました。 ... – nickf

同意します...なぜそれがうまくいかなかったのか理解する時間はかかりませんでしたが、CMSの答えがそれを説明しています。知っておいてよかった。 – beggs

がanalizeこの問題が発生した後、私は解決しなければならないこと、これはフェードアウト、変更htmlと、これはブードゥー教のコードのように感じている

$("#div_big_picture").fadeOut('slow',function(){ 
    $(this).html("<img src='" + str_to_load + "' height='800px' />") 
}).fadeIn("slow");

出典

2012-06-12 04:40:58 XMaster

なぜjquery fadeIn（）は.html（）で動作しませんか？

答えて

関連する問題