問題は、彼らがそこにいる前にリンクを操作しようとしているということです。
$(document).ready(function() {
$('#art_menu').load('get_cat.php');
$("#art_menu").fadeIn();
$('#art_menu .link').css("border","3px solid red");
// ^^ too soon, the `load `isn't complete yet
});
する必要があること:
$(document).ready(function() {
$('#art_menu').load('get_cat.php', function() {
// This callback happens after the load is complete
$("#art_menu").fadeIn();
$('#art_menu .link').css("border","3px solid red");
});
});
load
は非同期です操作は、load
への呼び出しはそれを開始します。後で(ネットワーク速度などに依存している場合)、後で完了します。ロードが完了したときに呼び出されるコールバックがあります。ロードされたコンテンツを操作する必要があるコードが必要です。
以下の「あなたの編集」の説明も参照してください。
オリジナルの答え:
あなたの例は動作するはずですが、あなたのHTMLは、2ヶ所のタイプミスがあります:あなたのli
要素が閉じていない、あなたの代わりに</li>
の終わりに<li>
を使用しました。そうでない場合は、我々はその子孫にcss
を呼び出し、任意の効果は表示されませんので、私はまた、コンテナからdisplay: none
を削除
<div id="left">
<div class="link">asdfgh</div>
<div id="art_menu">
<ul>
<li><div class="link">bla bla</div></li>
<li><div class="link">bla bla bla</div></li>
</ul>
</div>
</div>
注:ここでfixed exampleです!それで、あなたのexmaplesのいずれかが働くはずです(live link上記)。あなたの編集再
:私はあなたの前に私を与えたすべての提案を試みた
、それらのどれも動作しません。 ulは$('#art_menu').load()
で動的に注入され、次に.show()
が問題になる可能性がありますか?
おそらく、あなたのコードが実際にそこに存在する前に操作しようとしているとします。のあとにというコードしか実行されていない場合、それらは実際にそこにあります。後で注入されたという事実は無関係です。ここで
は.load
(live copy)を使用して更新作業例です:
jQuery(function($) {
$("#theButton").click(function() {
// This code runs when the button is clicked
$("#art_menu").load("http://jsbin.com/azaxev", function() {
// This code runs when the load is complete
$("#art_menu .link").css("color", "green");
});
});
// This code runs when there are no links, so we never
// see any effect form it
$("#art_menu .link").css("font-weight", "bold");
});
最終的な結果は、彼らがそこにいる前の行がそれら大胆な実行作るためのリンクは、大胆な緑が、ないであるということです、したがって効果はありません。
を使用することができますjqueryので
を
.find()
方法を使用することができ、私は私の答えを更新しました、あなただけです'css'をあまりにも早く呼びます。私はあなたの最初の編集からそれを推測し、コードを示す2回目の編集はそれを明確にした。 –