2

以下のコードは、Chrome と IE の両方で正常に動作します。

$.get("../ajax/BTBookAppointment.aspx?dsl=" + telNumberBox.value + "&date=" + requiredDate.value + "&timeslot=" + ddTimeslot.value, function (response, status, xhr) {
//DO some stuff
});

ただし、Firefox (バージョン 11.0) では、コールバック関数がヒットすることはありません。ブレークポイントでfirebugを使用し、コールバックが入力されないことを確認しました。ページが更新されたように見え、以前 JavaScript によって表示されていた要素が再び表示されます。

バグが何であるか、またはそれをさらにデバッグする方法についても途方に暮れています。アドバイスをいただければ幸いです。

EDIT : Fiddler と firebug は HTTP get を表示しません。また、 $.get を明示的に書き出そうとしましたが（以下を参照）、同じ動作が得られました

EDIT2: Darin Dimitrov が言及した提案を試してみましたが、それでも同じ動作を示します (ボタンをクリックするとページがポストバックされます)。これがそのままのコードです。

Javascript

function bookAppointment() {

    var url = "../ajax/BTBookAppointment.aspx";
    var dsl = "01753893530"
    var date = "20-04-2012";
    var timeslot = "PM";

    var data = { dsl: dsl, date: date, timeslot: timeslot };

    $.ajax({
        url: "../ajax/BTBookAppointment.aspx",
        data: data,
        success: function (response, status, xhr) {
       alert('into callback');
        },

    });

    return false;
}

HTML

<button id="btnBookAppointment" onclick="bookAppointment();"> Book</button>
4

3 に答える 3

4

あなたの質問で提供された情報から問題が何であるかを言うのは難しいです。NetworkFireBugのタブにリクエストが送信されているのが表示されないこと、およびページが更新されることを意味します。これは、AJAX呼び出しの前にコードにあるjavascriptエラーが原因で、起動が妨げられている可能性があります。また、DOM要素のクリックハンドラーまたは送信ハンドラーでこのAJAXリクエストを呼び出す場合は、このコールバックからfalseを返すことで、デフォルトのイベントをキャンセルしていることを確認できます。もう1つのポイントは、現在実行していないGETパラメーターの適切なURLエンコードです。

だからここにサンプルがあります：

$('#someElement').click(function() {
    // TODO: adapt the selectors to match your input field ids
    var dsl = $('#telNumberBox').val();
    var date = $('#requiredDate').val();
    var timeslot = $('#ddTimeslot').val();

    var data = { dsl: dsl, date: date, timeslot: timeslot };
    $.get('../ajax/BTBookAppointment.aspx', data, function (response, status, xhr) {
        //DO some stuff
    }); 

    return false;
});

また、AJAXリクエストを送信する前に発生する可能性のあるjavascriptエラーについてFireBugコンソールを監視することを忘れないでください。

これが機能しない場合は、リクエスト値をハードコーディングして、エラーの可能性をさらに絞り込もうとします。

var dsl = '123456789';
var date = '2012-04-07';
var timeslot = '14:15';

var data = { dsl: dsl, date: date, timeslot: timeslot };
$.get('../ajax/BTBookAppointment.aspx', data, function (response, status, xhr) {
    //DO some stuff
});

IEとChromeを殺さないが、FireFoxを殺す喫煙銃が見つかるまで、いくつかの値をハードコーディングすることで（エラーの可能性を排除する）、このエラーを絞り込む手法をスクリプトのさまざまな部分に適用できます。

于 2012-04-07T12:12:03.147 に答える
3

理由はわかりませんが、bookAppointment() が false を返した場合でも、ボタンが FF でデフォルトの動作 (ポストバック) をトリガーしていたようです。ボタンに return false を追加すると、問題が修正されました (以下を参照)。

<button id="btnBookAppointment" onclick="bookAppointment();return false;">
于 2012-04-13T12:29:22.060 に答える
0

ほとんどの情報は利用できません。

JQuery バージョン ?

JQuery UI バージョン ?

ajaxリクエストが呼び出されたとき?

ここで、この種の問題のデバッグを行う方法は次のとおりです。

a) まず、jQuery のバージョンで相対 URL に問題がないことを確認します [Google 用語「jquery ajax relative url」]

b) Jquery のロード後に Ajax オブジェクトが実際に作成されているかどうかを確認する

 $(document).ready(function(){
     //your ajax code
   });

c) ajax オブジェクトが CREATED であってもチェックし、適切なメソッドまたはイベントを呼び出してイベントを開始します

d) 静的 URL を記述し、新しいタブでリクエストを模倣します。たとえば、新しいタブを開いて、次のような URL を入力します。

 http://domain/../ajax/BTBookAppointment.aspx?dsl=xx&date=yy&timeslot=zz

e) 追加のアドオンを追加せずに、新しい Firefox プロファイルを作成します。そこでアプリケーションをテストします

これでどこまで行くか教えてください。これが役立つことを願っています:)

于 2012-04-07T12:39:58.540 に答える