使用 AJAX 的标准事件消息传递系统？

Question

AJAX 是否有任何标准或消息传递框架？

现在我有一个使用 Ajax 加载内容的页面。因为我的内容中有一个复杂的数据输入表单，所以我需要验证表单中可能发生的某些事件。 ，经过我的测试驱动的一些调整后：

asyncShould("search customer list click", 3, function() {
    stop(1000);
    $('#content').show();
    var forCustomerList = newCustomerListRequest();
    var forShipAndCharge = newShipAndChargeRequest(forCustomerList);

    forCustomerList.page = '../../vt/' + forCustomerList.page;
    forShipAndCharge.page = 'helpers/helper.php';
    forShipAndCharge.data = { 'action': 'shipAndCharge', 'DB': '11001' };

    var originalComplete = forShipAndCharge.complete;

    forShipAndCharge.complete = function(xhr, status) {
        originalComplete(xhr, status);
        ok($('#customer_edit').is(":visible"), 'Shows customer editor');
        $('#search').click();
        ok($('#customer_list').is(":visible"), 'Shows customer list');
        ok($('#customer_edit').is(":hidden"), 'Does not show customer editor');
        start();
    };

    testController.getContent(forShipAndCharge);
});

这是用于获取内容的控制器：

    getContent: function (request) {
        $.ajax({
            type:       'GET',
            url:        request.page,
            dataType:   'json',
            data:       request.data,
            async:      request.async,
            success:    request.success,
            complete:   request.complete
        });
    },

这是请求事件：

function newShipAndChargeRequest(serverRequest) {
var that = {
    serverRequest: serverRequest,
    page: 'nodes/orders/sc.php',
    data: 'customer_id=-1',
    complete: errorHandler,
    success: function(msg) {
        shipAndChargeHandler(msg);
        initWhenCustomer(that.serverRequest);
    },
    async: true
};
return that;

}

这是一个成功处理程序：

function shipAndChargeHandler(msg) {
    $('.contentContainer').html(msg.html);
    if (msg.status == 'flash') {
        flash(msg.flash);
    }
}

在我的服务器端，我最终得到一个如下所示的 JSON 结构：

$message['status'] = 'success';
$message['data'] = array();
$message['flash'] = '';
$message['html'] = '';
echo json_encode($message);

因此 现在加载的内容由两部分组成：

• HTML，这是表单的呈现。
• DATA，这是需要为表单
• FLASH 加载的任何数据，任何验证或服务器错误
• STATUS 告诉客户端服务器上发生了什么。

我的问题是：这是在客户端处理事件消息传递的有效方法还是我会走上一条心痛和痛苦的道路？

Answer 1

我认为这值得一看 http://www.jboss.org/errai

Answer 2

OpenAjax Hub（来自 OpenAjax 联盟）指定基于发布/订阅的事件中心（主题总线）。查看开源参考实现：http://openajaxallianc.sourceforge.net/。

TIBCO 还有一个用 JavaScript 实现的事件总线，称为 PageBus 但我想上面的内容更多“标准”。

Answer 3

我会投票支持 @dan-heberden 的建议：使用 api.jquery.com/ajaxComplete 或 api.jquery.com/ajaxSucces，例如以下使用 jquery 处理 ajax 事件。

$('.contentContainer').ajaxSuccess(function(e, xhr, settings) {
  var msg.html = "<p>You did it!</p>";
  shipAndChargeHandler(msg);
});

我相信你的问题不需要框架，接受 jquery 本身。

Answer 4

为什么你想从头开始构建一个消息处理程序，走上一条心痛和痛苦的道路？如果你已经在使用像 jQuery 这样的 js Lib，当然，你有一整套锋利的刀片，比如 全局 Ajax 事件处理程序 和一个 css 库，例如 主题滚轮用于设计您的消息！？

正如其他 SO 伙伴已经提到的：这来自 jQuery 页面：

当 Ajax 请求时显示消息
成功完成。

$("#msg").ajaxSuccess(function(evt, request, settings){
      $(this).append("<li>Successful Request!</li>");
      });

然后，我能做的，也许是，指出你更好地使用这个工具：

因为你不是在寻找典型的 AJAX 错误，但你想将其用于表单验证目的，我可以建议有这样的东西：

$.ajaxComplete(function(event, xhr, options) {
    var data = xhr.responceText;
    switch(data) {
    case 'err_1': 
    // do_something(1)
    break;
    case 'err_2': 
    // do_something(2)
    break;
    case 'err_3': 
    // do_something(3)
    break; 
    }
});

在验证所有数据后，每个 err_# 来自后端，如果发现错误，您通过 ajax 发送代码错误，其余的都是糖！ ;)

PS：通过这样做，即使 javascript 被禁用，您也可以防止滥用！