2016-05-02 1 views
2

コンテナの背景色をその子に同期したいと思います。おかげAJAXで読み込まれた要素の可変色にページ(ボディ)の色を設定するにはどうすればよいですか?

はここで、私が試したものです動作しません...

<script> 
$(document).ready(function() { 
var color = $("section").css("background-color"); 
    $('body').css("background-color", color); 
}); 
</script> 

ここに私のjQueryのAJAXです:

<script type="text/javascript"> 
function getPage(id) { 
$('#output').html('<img class="loader" src="/assets/img/loader.gif" />'); 
    jQuery.ajax({ 
     url: "get_page.php", 
     data:'id='+id, 
     type: "POST", 
     ;} 
    }); 
} 
getPage(1); 
</script> 

そして、私のhtml ...

<body> 
<div id="output"> 
    <section style=";"> 
     <p>Bla bla bla</p> 
    </section>  
</div> 
</body> 

そして、ショームの答えからの作業ソリューション!>

<script type="text/javascript"> 
$(document).ready(function() { 
    updateColor(); 
}); 

function getPage(id) { 
$('#output').html('<img class="loader" src="/assets/img/loader.gif" />'); 
    jQuery.ajax({ 
     url: "get_page.php", 
     data:'id='+id, 
     type: "POST", 
     success:function(data){$('#output').html(data);updateColor();} 
    }); 
} 
function updateColor(){ 
    var color = $("section").css("background-color"); 
    $('body').css("background-color", color); 
} 
getPage(1); 
</script> 
+2

HTMLを投稿できますか? –

+1

あなたはajaxを使用していません... – amflare

+0

は、一度ページが読み込まれるとあなたの関数が起動されるように見えますが、後でそれを更新するAJAXは決してありません。機能は動作しますが、目的に合ったものではありません; –

答えて

0

AJAX成功コールバックでドキュメントレディコールバックでコールする色変更コードを呼び出すこともできます。理想的には、関数にそれを回すと、そのようにそれを呼び出すことができます。

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

function getPage(id) { 
$('#output').html('<img class="loader" src="/assets/img/loader.gif" />'); 
    jQuery.ajax({ 
     url: "get_page.php", 
     data:'id='+id, 
     type: "POST", 
     } 
    }) 
    .done(function(){ 
     updateColor(); 
    } 
    // or just .done(updateColor) 
} 

function updateColor(){ 
    var color = $("section").css("background-color"); 
    $('body').css("background-color", color); 
} 

私はあなたがAJAX応答データから、あなたのHTMLを更新しているコードが表示されていないが、私はそれがすべて良いことだと仮定し、新しいsectionに背景色が定義されています。

+0

ここで私はあなたの答えを使用して思いついたものです。編集:上に更新 – teafields

+0

うん、それだけです。 Btw。あなたの質問に私の答えを繰り返す必要はありません。永遠にここにとどまるでしょう。 – Shomz

+0

もう一度ありがとう、私は本当に私が望んでいたような迅速な対応を期待していませんでした。あなたが推測していなかったら私はここに新しいです:-) – teafields

関連する問題