0

Ajax リターンに基づいて要素に対して単純な css 変更を行う必要がある場合、「this」のスコープに問題があると思います。

$('.time_slot_holder').click(function(){
    var data_day=$(this).data('agent_day');
    var data_time=$(this).data('agent_time');
    var data="agent_id="+agent_id+"&day="+data_day+"&time="+data_time
    $.ajax({
        type:"POST",
        url:"admin_includes/book_time.php",
        data:data,
        success:function(html){
            var split_html=html.split("|")
            if(split_html[0]=="B"){
                //booking exists
                alert("Bookings for this time slot exist. Contact Agent to arrange a re-assignment of this appointmnet.");
            }
            if(split_html[0]=="C"){
                //added to db
                $(this, '.time_slot_holder').css('background-color', 'red');
            }
            if(split_html[0]=="D"){

            }
        }
    });//end ajax
});

私がやろうとしているのは、要素 .time_slot_holder を使用してグリッドの色を変更することだけです

ajax リクエストからのぎこちない分割コールバックは無視してください。これは、データ属性を介して要素を識別しようとする試みにすぎません。基本的に、クリックされた要素の参照を ajax のコールバックまで取得する必要があります。

4

2 に答える 2

1

contextAJAX リクエストのオプションをthis;に設定する必要があります。

$.ajax({
    type:"POST",
    url:"admin_includes/book_time.php",
    context: this,
    //..
});

そうでなければ、オブジェクトthisになってしまいjqXHRます。

this別の (より一般的な) アプローチは、の値を別の変数に格納すること です。

var that = this;

$.ajax({
    type:"POST",
    url:"admin_includes/book_time.php",
    data:data,
    success:function(html){
        // Use `that` instead of `this` in here.
    }
});//end ajax

また、何$(this, '.time_slot_holder')を選択するのかわかりませんが、それが機能するかどうかもわかりません (HTML マークアップを確認する必要があります)。

thisが の子孫である場合、正常'.time_slot_holder'に動作します。

于 2012-07-03T15:01:47.430 に答える
1

jQuery 要素をコンテキストとして使用する

$('.time_slot_holder').click(function(){
    var data_day=$(this).data('agent_day');
    var data_time=$(this).data('agent_time');
    var data="agent_id="+agent_id+"&day="+data_day+"&time="+data_time

    $.ajax({
        type:"POST",
        url:"admin_includes/book_time.php",
        data:data,
        context : $(this),
        success:function(html){
            var split_html=html.split("|")
            if(split_html[0]=="B"){
                //booking exists
                alert("Bookings for this time slot exist. Contact Agent to arrange a re-assignment of this appointmnet.");

            }
            if(split_html[0]=="C"){
                //added to db
                $(this).css('background-color', 'red');
            }
            if(split_html[0]=="D"){

            }


        }
    });//end ajax

});
于 2012-07-03T15:09:21.830 に答える