三次演算子を使用してオブジェクトに「状態」変数を与えて最適化したい次の作業コードがあります。ただし、これを達成するためにクリックイベントを正確に配置する場所については混乱しています。
HTML (次のレイアウトで複数の div をサポート):
<div class="adbox">
<div class="ad-image">Image 2 Goes Here <a class="swap-content" href="#">Next</a></div>
<div class="ad-content">Ad 2 text goes here <a class="swap-image" href="#">Back</a></div>
</div>
jQuery コード:
<script lang="javascript">
$(document).ready(function() {
var speed = 500;
$('a.swap-content').click(function() {
var myad = $(this).parent().parent();
$(myad).find('div.ad-image').fadeOut(speed, function(){
$(myad).find('div.ad-content').fadeIn(speed)
});
});
$('a.swap-image').click(function() {
var myad = $(this).parent().parent();
$(myad).find('div.ad-content').fadeOut(speed, function(){
$(myad).find('div.ad-image').fadeIn(speed)
});
});
});
</script>