-2

わかりました、私はそれが実際に何$(this)this意味するのかを知っています。しかし、私が取り組んでいる小さなプロジェクトは、私が持っているいくつかの重複コードを再利用可能な関数に適合させようとしています。

これで、同じ親div内のその下にある特定のオブジェクトをアニメーション化する関数があります。どちらが機能するか、それは確認されました。ただし、現在、これをトリガーするイベントが2つあります。

1つは読み込みイベントで、この要件に一致する要素に対してループ.ready()を実行します。これは正常に機能します。$.each()問題の要素を私が使用する関数に渡すには

$(this)関数のパラメーターとして、このプロジェクトの仕様に従って、関数がそのパラメーターを受け取り、それを処理します。ただし、問題が発生しているのは、この関数をトリガーするために使用する2番目のイベントです。

これは、要素ごとのクリックベースのイベントです。そのために私が試し.click()たのは.live()、オブジェクトを認識する唯一のもののようです.delegate()live()私は現在、このプロジェクトでjQuery1.4.4を使い続けています。だから.on()私には利用できないか、私もそれを試してみます。delegate()また、なぜ機能するのか、click()機能しないのか混乱しlive()ており、要素がDOMでレンダリングされているにもかかわらず機能しますが、それは私が現在探しているものとはまったく異なります。

結論として、この実用的な例で、前述のループを介して関数を呼び出す方法は次のとおりです。

$('.panels h3').each(function()
{
    accordionUpDown($(this), false);
});

このクリックベースの例は機能しませんが、機能するはずですが機能しません。

$('.panels h3').live('click',function()
{
    accordionUpDown($(this), true);
});

また、ここで参照するために、関数自体があります。

function accordionUpDown(theElem, fx)
{
    //alert('test'+theElem);
    if(theElem.hasClass('active'))
    {
        var $elem = theElem.next('div');
        var elemY = ($elem.children('div').innerHeight()+2);

        if(fx == false)
        {
            $elem.addClass('active').css({height:elemY+'px'});
        }
        else
        {
            $elem.addClass('active').animate({height:elemY+'px'}, 2000);
        }
    }
    if(!theElem.hasClass('active'))
    {
        var $elem = theElem.next('div');
        var elemY = '0px';
        if(fx == false)
        {
            $elem.css({height:elemY}).removeClass('active');
        }
        else
        {
            $elem.animate({height:elemY}, 2000).removeClass('active');
        }
    }
}

時間を節約するために、同じ効果を得るためにjQuery UIのようなものを使用しないのはなぜかと尋ねます。適切に配置されたら、スタイリングの問題と、計画されている他の機能を追加してください。いずれにせよ、カスタムニーズは簡単な概念を超えています。

とにかく、クリックの場合、私$(this)はどういうわけか間違ったものを拾っているのかどうか疑問に思い始めています、そしてもしそうなら、それはおそらくそれが期待どおりに機能していないので、その場合、私はどのように私を理解しようとしていますどの要素$(this)が実際にあるかを見つけることができます

クイック編集、すべてを見たい人のために、私はフィドルバージョンを作成しました。 http://jsfiddle.net/sDeq2/HTML部分も含まれています

4

2 に答える 2

1

IDまたはその他の識別可能な属性を印刷できませんか?

$(this).attr('id')
于 2012-12-10T22:33:20.447 に答える
0

最初の方法論を誤解したようです。発生した問題の説明に基づいて(.liveは機能しますが、.clickは機能しません)、DOMが実際に準備が整う前に(.ready()呼び出し内で)コードを実行することを提案する必要があります。 )。

これらの3つのイベント添付シナリオはすべて、コンテキスト外で適切に機能します。 http://jsfiddle.net/CsP2g/

$(document).ready(function(){
    $('.someClass h3').click(function(){
        alert('fired click event that was bound to multiple items at once using .click()');
    });

    $('.someClass h3').each(function(){
        $(this).click(function(){
          alert('fired click event that was bound to one item at a time using .each and .click()');
        });
    });

    $('.someClass h3').live("click", function(){
        alert('fired click event that was bound to multiple items at once using .live("click", func)');
    });
});
于 2012-12-10T22:35:22.357 に答える