1

class で div を使用していabcます。クラスを使用してそのdivを選択し、ajaxリクエストを行うjQuery関数があります。ajax関数が正常に返されたら、classのdivになるまでajaxメソッドが再度呼び出されないようにクラスを変更しましたabc。しかし、div のクラスをxyz同じ ajax 関数に更新した後でも、再度呼び出されます。

success: function(data){
                    //updating the class here
                    $(self).addClass('xyz').removeClass('abc');
                }

クラスが更新されていることをソースで確認できますが、それでも同じ属性セレクターが以前のクラスを選択し、ajax メソッドを再度実行します。私がやろうとしていることを行う他の方法はありますか?助けてください!前もって感謝します。

編集:

$('.up_arrow').each(function() {
    $(this).click(function(event) {

        var resid = $(this).attr('name');

        var post_data = {
            'resid' : resid,
            '<?php echo $this->security->get_csrf_token_name(); ?>' : '<?php echo $this->security->get_csrf_hash(); ?>'
        };

        var self = this;

        if(resid){
            $.ajax({
                type: 'POST',
                url: "/ci_theyaw/restaurants/plusrepo",
                data: post_data,
                success: function(data){
                    //console.log($(this).siblings('.rep_count').text());
                    $(self).addClass('up_arrowed').removeClass('up_arrow');
                    $(self).css('background-position','0 40px');
                    $(self).next('.rep_count').html(data);
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    alert(xhr.status);
                    console.log(xhr.responseText);
                    alert(thrownError);
                }
            });
        }
    });
});

これは、仕事をする完全な機能です。ここで、更新するクラスはup_arrow->up_arrowedで、関数のセレクターは ですup_arrow。しかし、更新後はとにかく実行されます。

4

1 に答える 1

2
$('.up_arrow').each(function() {

up_arrow ここで何が起こるかというと、jQuery はその時点でクラスを持つすべての要素を探し、イベントをそれらの要素に直接結び付けます。それ以降はクラスが変わっても関係ありません。

.on()代わりに使用する場合:

$( document ).on( 'click', '.up_arrow', function(event) {
    var resid = $(this).attr('name');
    // etc

...コードが最初に実行されたときではなく、ユーザーがページをクリックしたときに.up_arrowセレクターが評価されるようになりました。すべての要素を含む共通の静的要素に変更することもできます。document.up_arrow


無関係な補足事項:他の状況で使用する場合.click()(この場合は使用できません.each()) 、単純なクリック ハンドラーを使用する必要はありません。ちょうどする$('.selector').click(function() {。各要素に自動的に適用されます。

于 2013-10-10T11:17:11.920 に答える