Ajax addEventListener（）问题/怪异行为

我正在为Facebook开发一款游戏。我正在使用PHP和FBJS。我使用addEventListener（）将事件附加到两个按钮。每个按钮都有自己的事件处理程序，它是一个js函数。调用第一个事件处理程序（loadNewCargo（））时没有问题。但是第二个事件处理程序（discardeExistingCargo（））会在调用页面时导致页面刷新。我看到的示例对多个元素使用单个事件处理程序函数。我正在为每个元素创建一个处理程序。这是违法的吗？下面是代码（'load-new-submit'和'discard existing submit'是对话框上两个按钮的ID）：

函数loadCargo（）{
var actionPrompt=document.getElementById（'action-prompt'）；
actionPrompt.setTextValue（'Loading cargo…'）；
var ajax=newajax（）；
ajax.responseType=ajax.JSON；
ajax.ondone=函数（数据）{
//调试器；
ajax.responseType=ajax.FBML；
ajax.ondone=函数（fbjsData）{
//调试器；
if（data.loadableCargo.length==0）{
移动列车手册（）；
}否则{
var dialog=new dialog（）.showChoice（'Load Cargo'，fbjsData，'Minimize'，'Pass'）；
var dlgBtnNew=document.getElementById（'load-new-submit'）；
dlgBtnNew.cityId=data.loadableCargo.city\u id；
dlgBtnNew.trainId=data.loadableCargo.train\u id；
dlgBtnNew.addEventListener（'click'，loadNewCargo）；
/**/
var dlgBtnDiscard=document.getElementById（'discard-existing-submit'）；
dlgBtnDiscard.cityId=data.loadableCargo.city\u id；
dlgBtnDiscard.trainId=data.loadableCargo.train\u id；
dlgBtnDiscard.addEventListener（'单击'，丢弃现有货物）；
/**/
dialog.onconfirm=函数（）{
//提交表单（如果存在），然后隐藏对话框。
dialog.hide（）；
actionPrompt=document.getElementById（'action-prompt'）；
actionPrompt.setInnerXHTML（“”+
'已最小化“装载货物”对话框'+
''+
''+
''+
''+
''+
'');
actionButton=document.getElementById（“下一阶段”）；
actionButton.setValue（“最大化”）；
actionButton.addEventListener（'click'，loadCargoEventHandler）；
};
dialog.oncancel=函数（）{
移动列车手册（）；
}
}
}
post（baseURL+'/turn/load cargo dialog fbjs'，data）；
}
post（baseURL+'/turn/load-cargo'）；
}
函数loadCargoEventHandler（evt）{
如果（evt.type=='单击'）{
var dialog=new dialog（）.showChoice（'Load Cargo'，fbjs_Load_Cargo_select，'Minimize'，'Pass'）；
dialog.onconfirm=函数（）{
//提交表单（如果存在），然后隐藏对话框。
dialog.hide（）；
var actionPrompt=document.getElementById（'action-prompt'）；
actionPrompt.setInnerXHTML（“”+
'已最小化“装载货物”对话框'+
''+
''+
''+
''+
''+
'');
var actionButton=document.getElementById（“下一阶段”）；
actionButton.setValue（“最大化”）；
actionButton.addEventListener（'click'，loadCargoEventHandler）；
};
dialog.oncancel=函数（）{
移动列车手册（）；
}
}
}
功能加载新货物（evt）{
//新建对话框（）.showMessage（'loadNewCargo'，'city id='+cityId+'，train id='+trainId）；
//调试器；
cityId=evt.target.cityId；
trainId=evt.target.trainId；
ajax=新ajax（）；
ajax.responseType=ajax.JSON；
参数={'load cargo submit'：“装载新货物”，“城市id”：城市id，“列车id”：列车id}；
ajax.ondone=函数（数据）{
openCargoHolds=data.openCargoHolds；
cargoHoldsUsed=0；
ajax.responseType=ajax.FBML；
param={'openCargoHolds'：data.openCargoHolds，'cityGoods'：data.cityGoods，'trainId'：data.trainId}；
ajax.ondone=函数（fbjsData）{
//调试器；
var dialog=new dialog（）.showChoice（'Load Cargo'，fbjsData，'Load Cargo'，'Cancel'）；
dialog.onconfirm=函数（）{
var货物=[]；
var goodsIds=[]；
numGoods=document.getElementById（'goods-count'）.getValue（）；
对于（var i=0；ifunction loadCargo() {
  var actionPrompt = document.getElementById('action-prompt');
  actionPrompt.setTextValue('Loading cargo...');

  var ajax = new Ajax();
  ajax.responseType = Ajax.JSON;
  ajax.ondone = function(data) {
//debugger;
    ajax.responseType = Ajax.FBML;
    ajax.ondone = function(fbjsData) {
//debugger;
      if(data.loadableCargo.length == 0) {
        moveTrainManual();
      } else {
        var dialog = new Dialog().showChoice('Load Cargo', fbjsData, 'Minimize', 'Pass');

        var dlgBtnNew = document.getElementById('load-new-submit');
        dlgBtnNew.cityId = data.loadableCargo.city_id;
        dlgBtnNew.trainId = data.loadableCargo.train_id;
        dlgBtnNew.addEventListener('click', loadNewCargo);
/**/
        var dlgBtnDiscard = document.getElementById('discard-existing-submit');
        dlgBtnDiscard.cityId = data.loadableCargo.city_id;
        dlgBtnDiscard.trainId = data.loadableCargo.train_id;
        dlgBtnDiscard.addEventListener('click', discardExistingCargo);
/**/
        dialog.onconfirm = function() {
          // Submit the form if it exists, then hide the dialog.
          dialog.hide();
          actionPrompt = document.getElementById('action-prompt');
          actionPrompt.setInnerXHTML('<span><div id="action-text">'+
            'The "Load cargo" dialog has been minimized'+
            '</div>'+
            '<div id="action-end">'+
            '<form action="" method="POST">'+
            '<input type="button" value="Maximize" id="next-phase" onclick="loadCargo();" />'+
            '</form>'+
            '</div></span>');
          actionButton = document.getElementById('next-phase');
          actionButton.setValue('Maximize');
          actionButton.addEventListener('click', loadCargoEventHandler);
        };
        dialog.oncancel = function() {
          moveTrainManual();
        }
      }
    }
    ajax.post(baseURL + '/turn/load-cargo-dialog-fbjs', data);
  }
  ajax.post(baseURL + '/turn/load-cargo');
}

function loadCargoEventHandler(evt) {
  if(evt.type == 'click') {
    var dialog = new Dialog().showChoice('Load Cargo', fbjs_load_cargo_select, 'Minimize', 'Pass');
    dialog.onconfirm = function() {
      // Submit the form if it exists, then hide the dialog.
      dialog.hide();
      var actionPrompt = document.getElementById('action-prompt');
      actionPrompt.setInnerXHTML('<span><div id="action-text">'+
        'The "Load cargo" dialog has been minimized'+
        '</div>'+
        '<div id="action-end">'+
        '<form action="" method="POST">'+
        '<input type="button" value="Maximize" id="next-phase" onclick="loadCargo();" />'+
        '</form>'+
        '</div></span>');
      var actionButton = document.getElementById('next-phase');
      actionButton.setValue('Maximize');
      actionButton.addEventListener('click', loadCargoEventHandler);
    };
    dialog.oncancel = function() {
      moveTrainManual();
    }
  }
}

function loadNewCargo(evt) {
  //new Dialog().showMessage('loadNewCargo', 'city id='+cityId+', train id='+trainId);
//debugger;
  cityId = evt.target.cityId;
  trainId = evt.target.trainId;

  ajax = new Ajax();
  ajax.responseType = Ajax.JSON;
  param = { 'load-cargo-submit': "Load new goods", 'city-id': cityId, 'train-id': trainId };
  ajax.ondone = function(data) {
    openCargoHolds = data.openCargoHolds;
    cargoHoldsUsed = 0;
    ajax.responseType = Ajax.FBML;
    param = { 'openCargoHolds': data.openCargoHolds, 'cityGoods': data.cityGoods, 'trainId': data.trainId };
    ajax.ondone = function(fbjsData) {
//debugger;
      var dialog = new Dialog().showChoice('Load Cargo', fbjsData, 'Load cargo', 'Cancel');
      dialog.onconfirm = function() {
        var goods = [];
        var goodsIds = [];
        numGoods = document.getElementById('goods-count').getValue();

        for(var i = 0; i < numGoods; i++) {
          j = i + 1;
          goods[i] = document.getElementById('goods-' + j).getValue();
          goodsIds[i] = document.getElementById('goods-id-' + j).getValue();
        }
        var trainId = document.getElementById('train-id').getValue();
        param = { "goods": goods, "goods-id": goodsIds, "train-id": trainId };
        ajax.responseType = Ajax.JSON;
        ajax.ondone = function(data) {
          loadCargo();
        }
        ajax.post(baseURL + '/turn/do-load-cargo-new', param);
        //dialog.hide();
      };
      dialog.oncancel = function() {
        loadCargo();
      }
    }
    ajax.post(baseURL + '/turn/load-cargo-new-dialog-fbjs', param);
  }
  ajax.post(baseURL + '/turn/load-cargo-select', param);
}

function discardExistingCargo(evt) {
  //new Dialog().showMessage('loadNewCargo', 'city id='+cityId+', train id='+trainId);

  cityId = evt.target.cityId;
  trainId = evt.target.trainId;
/**/
  ajax = new Ajax();
  ajax.responseType = Ajax.JSON;
  param = { 'load-cargo-submit': "Discard existing goods", 'city-id': cityId, 'train-id': trainId };
  ajax.ondone = function(data) {
    ajax.responseType = Ajax.FBML;
    param = { 'openCargoHolds': data.openCargoHolds, 'trainGoods': data.trainGoods, 'trainId': data.trainId };
    ajax.ondone = function(fbjsData) {
      var dialog = new Dialog().showChoice('Discard Cargo', fbjsData, 'Discard cargo', 'Cancel');
      dialog.onconfirm = function() {
        var goods = [];
        var goodsIds = [];
        numGoods = document.getElementById('goods-count').getValue();
        for(var i = 0; i < numGoods; i++) {
          j = i + 1;
          goods[i] = document.getElementById('goods-' + j).getValue();
          goodsIds[i] = document.getElementById('goods-id-' + j).getValue();
        }
        var trainId = document.getElementById('train-id').getValue();
        param = { "goods": goods, "goods-id": goodsIds, "train-id": trainId };
        ajax.responseType = Ajax.JSON;
        ajax.ondone = function(data) {
          loadCargo();
        }
        ajax.post(baseURL + '/turn/do-load-cargo-discard', param);
        //dialog.hide();
      };
      dialog.oncancel = function() {
        loadCargo();
      }
    }
    ajax.post(baseURL + '/turn/load-cargo-discard-dialog-fbjs', param);
  }
  ajax.post(baseURL + '/turn/load-cargo-select', param);
/**/
}