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 显示的元素再次变得可见。

我不知道这个错误可能是什么,甚至不知道如何进一步调试它。任何意见,将不胜感激。

编辑:提琴手和萤火虫从不显示 HTTP 获取。我也尝试过明确写出 $.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 来确保取消默认事件。另一点是您当前未执行的 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 请求之前查看 FireBug 控制台以了解可能发生的 javascript 错误。

如果这不起作用,我会尝试对请求值进行硬编码以尝试进一步缩小错误的可能性:

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 版本没有 RELATIVE urls [Google term "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 回答