2012-01-06 17 views
8

$(this)'in şu anda jQuery'de ne olduğunu bulmanın en iyi yolu nedir?

Örneğin çok fazla yardımcı olmuyor.

Sormamın nedeni, bir kod parçasının şu anda kodu bir işleve taşıdıktan sonra yapması gerekenleri yapmadığıdır.

Aşağıdaki alıntı, şimdi bir işlevdedir ve $ (this) şimdi DOMWindow'a başvurmaktadır.

if($(this).hasClass('open')) 
    { 
    alert('I should be closed'); 
    $(this).removeClass('open').addClass('closed'); 
    $(this).parents('article').css('border', '1px solid red').animate({'width': '212px'}, 100, "linear", function() { 
    run_masonry(); 
    }); 
    } 
    else 
    { 
    alert('I should be open'); 
    $(this).removeClass('closed').addClass('open'); 
    $(this).parents('article').css('border', '1px solid blue').animate({'width': '646px'}, 100, "linear", function() { 
    run_masonry(); 
    }); 
} 

Orijinal tıklanan öğe olarak $ (this) olarak nasıl saklarım?

cevap

22

$(this)'in şu anda jQuery'de ne olduğunu bulmanın en iyi yolu nedir? Bir jQuery dönecektir

console.log($(this)); 

nesne sarılmış: En sevdiğiniz javascript hata ayıklama aracı konsola (örneğin gibi FireBug veya Chrome geliştirici araç çubuğu) bunu oturum açarak

. Eğer yerli nesne hakkında daha fazla bilgi edinmek isterseniz kullanabilirsiniz: javascript gelişmeyi yapıyorsanız

console.log(this); 

Eğer bir javascript hata ayıklama aracı kullanmak gerekir. alert böyle bir araç değildir.


Şimdi bazı kod kaynağı ile sorunuzu güncelledik o küresel etki alanında $(this) kullanıyor görünüyor. Daha sonra window nesnesine başvurur. Eğer bazı tıklanan elemanın ya da bir şey ifade etmek istiyorsanız, öncelikle .click olaya abone olmak zorunda kalacak:

function foo() { 
    // here $(this) will refer to the original element that was clicked. 
} 

$('.someSelector').click(foo); 
:

$('.someSelector').click(function() { 
    // here $(this) will refer to the original element that was clicked. 
}); 

veya ayrı bir işlevi bu kodu yansıtmak istedim

veya: bir işlev kodu değişiklikleri genellikle kapsamı kodunu hareket ile

function foo(element) { 
    // here $(element) will refer to the original element that was clicked. 
} 

$('.someSelector').click(function() { 
    foo(this); 
}); 
+0

çok veri döndüren daraltmak için yine de var mı –

+0

@CraigWard, evet, '(this) console.log kullanın;' sadece inci giriş yapmak için. e yerli nesne ve '$ (this)' değil. –

+0

@CraigWard Ne kadar daraltmak istersiniz? Keşke $ (this) .attributesThatIWantToSee() ' – Connell

1

. Yani "bu" artık orijinal nesneyi değil, yeni bir (ya da global "pencere" nesnesine) başvurmayacaktır. Kodunuzu gösterirseniz, sorunu tanımlayabileceğiz.

+0

Bu sorun gibi geliyor. DOMWindow'u döndürüyor. Fonksiyonda iken $ (bu) tutmak için bir yolu var mı? –

+0

Pek çok yol, ancak yanlış yaptığınız şeye bağlıdır ... –

+0

Sorunun bir kısmını kodun içerecek şekilde güncelledim –

0

Sana böyle bir şey yapmak şüpheli: Bu durumda clickHandler yılında

$('#element').click(function() { 
    clickHandler(); 
}); 

Pencere nesne bağlamında çağrılır.

$('#element').click(clickHandler); 
0

sen benim sürümü veya jquerylog ait en Prinzhorn versiyonunu kullanabilirsiniz etrafında geçirilen ne kontrol etmek isterseniz: Doğru bağlam sadece kodunuzu değiştirmek korumak için.Bu ne oluyor size adım adım tanımlamasına yardımcı olur: Her adımda div tanımlayan şöyle bir çıktı (alırsınız

$("#foo").parents(".t1").next().prev().parent().find(".t2:last .t4:last").text("test"); 

: For

http://www.jquerylog.com/https://github.com/fmsf/jQueryLog

çağrı gibi ?:

$('#foo'): [<div id="foo" class="t3"></div>] 
    parents('.t1'): [ <div class="t1">…</div> ] 
     next(undefined): [ <div class="t1">…</div> ] 
      prev(undefined): [ <div class="t1">…</div> ] 
       parent(undefined): [ <body>…</body> ] 
        find('.t2:last .t4:last'): [<div class="t4">teste</div>] 
İlgili konular