多个按钮调用单独的AJAX函数I n1页面

<button id="button1" class="ajax-button">按钮1</button>
<button id="button2" class="ajax-button">按钮2</button>
<button id="button3" class="ajax-button">按钮3</button>

document.addEventListener('DOMContentLoaded', function() {
  var buttons = document.getElementsByClassName('ajax-button');
  
  for (var i = 0; i < buttons.length; i++) {
    buttons[i].addEventListener('click', function() {
      var buttonId = this.id; // 获取按钮的ID
      
      // 根据按钮的ID调用相应的AJAX函数
      if (buttonId === 'button1') {
        ajaxFunction1();
      } else if (buttonId === 'button2') {
        ajaxFunction2();
      } else if (buttonId === 'button3') {
        ajaxFunction3();
      }
    });
  }
});

function ajaxFunction1() {
  // 执行按钮1对应的AJAX请求
}

function ajaxFunction2() {
  // 执行按钮2对应的AJAX请求
}

function ajaxFunction3() {
  // 执行按钮3对应的AJAX请求
}

<button data-ajax-function="ajaxFunction1" class="ajax-button">按钮1</button>
<button data-ajax-function="ajaxFunction2" class="ajax-button">按钮2</button>
<button data-ajax-function="ajaxFunction3" class="ajax-button">按钮3</button>

document.addEventListener('click', function(event) {
  var target = event.target;
  
  if (target.classList.contains('ajax-button')) {
    var ajaxFunction = target.dataset.ajaxFunction; // 获取按钮的自定义属性
    
    // 根据按钮的自定义属性调用相应的AJAX函数
    if (ajaxFunction === 'ajaxFunction1') {
      ajaxFunction1();
    } else if (ajaxFunction === 'ajaxFunction2') {
      ajaxFunction2();
    } else if (ajaxFunction === 'ajaxFunction3') {
      ajaxFunction3();
    }
  }
});

function ajaxFunction1() {
  // 执行按钮1对应的AJAX请求
}

function ajaxFunction2() {
  // 执行按钮2对应的AJAX请求
}

function ajaxFunction3() {
  // 执行按钮3对应的AJAX请求
}