Javascript 在单击事件侦听器之前触发回调函数的AJAX函数

下面的代码处理一个AJAX请求，该请求完成后将车辆对象值传递给populateSummaryBlocks回调函数。回调函数被设置为侦听单击事件，但代码在AJAX请求完成后立即触发。我需要在代码中调整什么，以防止回调函数立即启动，并禁用按钮的默认行为

$("#get-rego").click(function(e) {
  e.preventDefault();

  var regoAjax = document.querySelector(".ajax-loader");
  addClass(regoAjax, "active");

  var plate = document.getElementById("input_2_6").value;

  var requestData = $.post({
    url: "/wp-admin/admin-ajax.php",
    data: {
      "action": "get_vehicle",
      "plate": plate,
    },
    "dataType": "json"
  });

  requestData.done(function(obj) {
    var response = obj.idh;
    var vehicleMake,
        vehicleModel,
        vehicleYear,
        vehicleColour,
        vehicleSubModel,
        vehicleBodyStyle,
        vehicleWofExpiry,
        vehicleRegoExpiry;

    removeClass(regoAjax, "active");
    removeClass(vehicleDetails, "gfield_conditionally_hidden");
    vehicleMake = response.vehicle.make;
    vehicleModel = response.vehicle.model;
    vehicleYear = response.vehicle.year_of_manufacture;
    vehicleColour = response.vehicle.main_colour;
    vehicleSubModel = response.vehicle.submodel;
    vehicleBodyStyle = response.vehicle.body_style;
    vehicleWofExpiry = response.vehicle.expiry_date_of_last_successful_wof;
    vehicleRegoExpiry = response.vehicle.date_of_last_registration;

    var vehicleDataSummaryOutput;
    vehicleDataSummaryOutput = "<div class=\"summary\">" +
      "<ul>" +
      "<li><span class=\"label\">Make:</span> " + titleCase(vehicleMake) + "</li>" +
      "<li><span class=\"label\">Model:</span> " + titleCase(vehicleModel) + "</li>" +
      "<li><span class=\"label\">Year:</span> " + vehicleYear + "</li>" +
      "<li><span class=\"label\">Colour:</span> " + vehicleColour + "</li>" +
      "<li><span class=\"label\">Submodel:</span> " + titleCase(vehicleSubModel) + "</li>" +
      "<li><span class=\"label\">Body Style:</span> " + vehicleBodyStyle + "</li>" +
      "</ul>" +
      "</div>";

    document.querySelector(".vehicle-details").innerHTML = vehicleDataSummaryOutput;
    populateSummaryBlocks(response.vehicle);
  });

  requestData.fail(function( jqXHR, textStatus ) {
    alert( "Request failed: " + textStatus );
  });
});

var customerName = document.getElementById("input_2_46_3").value;
var summaryBlocks = document.getElementsByClassName("summary-block");
var getQuoteSummaryBlock = summaryBlocks[0];
var mbiPaymentSummaryBlock = summaryBlocks[1];
var mbiWeekly = document.querySelector(".mbi-weekly");
var quoteLegalText = document.querySelector(".quote-legal-text");
var quoteNextButton = document.getElementById("gform_next_button_2_63");

function populateSummaryBlocks(vehicle, customerName) {
  var vehicleMake = vehicle.make;
  var vehicleModel = vehicle.model;
  var mbiWeeklyPrices = [
    "7.29",
    "11.74",
    "46.12"
  ];

  if(document.querySelector('input[name="input_52"]:checked').value = "standard") {
    mbiWeekly.innerHTML = mbiWeeklyPrices[0];
  } else if(document.querySelector('input[name="input_52"]:checked').value = "special") {
    mbiWeekly.innerHTML = mbiWeeklyPrices[1];
  } else {
    mbiWeekly.innerHTML = mbiWeeklyPrices[2];
  }

  removeClass(getQuoteSummaryBlock, "gfield_conditionally_hidden");
  removeClass(mbiPaymentSummaryBlock, "gfield_conditionally_hidden");
  removeClass(quoteLegalText, "gfield_conditionally_hidden");
  addClass(quoteNextButton, "is-enabled");

  document.querySelector(".quote-advice-content").appendChild(quoteNextButton);

  var vehicleMakeText = document.body.querySelectorAll(".vehicle-make-text");
  for (var i = 0; i < vehicleMakeText.length; i++) {
    var make = vehicleMakeText[i];
    if (typeof vehicleMake !== "undefined") {
      make.innerHTML = vehicleMake;
    }
  }

  var vehicleModelText = document.body.querySelectorAll(".vehicle-model-text");
  for (var i = 0; i < vehicleModelText.length; i++) {
    var model = vehicleModelText[i];
    if (typeof vehicleModel !== "undefined") {
      model.innerHTML = vehicleModel;
    }
  }

  var customerNameText = document.body.querySelectorAll(".customer-first-name-text");
  for (var i = 0; i < customerNameText.length; i++) {
    var name = customerNameText[i];
    if (typeof customerName !== "undefined") {
      name.innerHTML = customerName;
    }
  }
  document.querySelector("#getQuote").style.display = "none";
}
document.querySelector("#getQuote").addEventListener("click", populateSummaryBlocks, false);

$（“#获取注册表”）。单击（函数（e）{
e、 预防默认值（）；
var regoAjax=document.querySelector（“.ajax加载器”）；
addClass（regoAjax，“活动”）；
var plate=document.getElementById（“input_2_6”）.值；
var requestData=$.post({
url:“/wp admin/admin ajax.php”，
数据：{
“行动”：“获取车辆”，
“板块”：板块，
},
“数据类型”：“json”
});
requestData.done（函数（obj）{
var响应=obj.idh；
var vehicleMake，
车辆模型，
车载耳，
车辆颜色，
车辆子模型，
车辆驾驶舱样式，
试验车辆，
车辆过期；
removeClass（regoAjax，“活动”）；
removeClass（车辆详情，“有条件地隐藏”）；
vehicleMake=response.vehicle.make；
vehicleModel=response.vehicle.model；
vehicleYear=响应。车辆。制造年份；
车辆颜色=响应。车辆。主颜色；
vehicleSubModel=response.vehicle.submodel；
vehicleBodyStyle=响应.vehicle.body_样式；
VehicleOfExpiry=response.vehicle.expiration\u最后一次成功的日期\u wof；
VehiclerLegoExpiry=response.vehicle.date\u上次注册的日期；
var车辆数据汇总输出；
vehicleDataSummaryOutput=“”+
“
”+
制作：“+标题库（车辆制作）+””+
型号：“+标题库（车辆模型）+”
”+
“
年份：“+vehicleYear+”
”+
颜色：“+车辆颜色+””+
子模型：“+标题库（车辆子模型）+””+
车身样式：“+vehicleBodyStyle+””+
“
”+
"";
document.querySelector（“.vehicle details”）.innerHTML=车辆数据汇总输出；
填充汇总块（响应.车辆）；
});
requestData.fail（函数（jqXHR，textStatus）{
警报（“请求失败：+textStatus”）；
});
});
var customerName=document.getElementById（“input_2_46_3”）.值；
var summaryBlocks=document.getElementsByClassName（“摘要块”）；
var getQuoteSummaryBlock=summaryBlocks[0]；
var mbiPaymentSummaryBlock=summaryBlocks[1]；
var mbiWeekly=document.querySelector（“.mbi weekly”）；
var quoteElegalText=document.querySelector（“.quote法律文本”）；
var quoteNextButton=document.getElementById（“gform_next_button_2_63”）；
函数填充汇总块（车辆、客户名称）{
var vehicleMake=车辆制造；
var vehicleModel=车辆.model；
var mbiWeeklyPrices=[
"7.29",
"11.74",
"46.12"
];
if（document.querySelector（'input[name=“input_52”]：checked'）。value=“standard”）{
mbiWeekly.innerHTML=mbiWeeklyPrices[0]；
}else if（document.querySelector（'input[name=“input_52”]：checked'）。value=“special”）{
mbiWeekly.innerHTML=mbiWeeklyPrices[1]；
}否则{
mbiWeekly.innerHTML=mbiWeeklyPrices[2]；
}
removeClass（getQuoteSummaryBlock，“gfield”有条件地隐藏）；
removeClass（mbiPaymentSummaryBlock，“gfield\u条件隐藏”）；
removeClass（引用ElegalText，“gfield”有条件地隐藏）；
addClass（quoteNextButton，“已启用”）；
document.querySelector（“.quote advice content”）.appendChild（QuoteNext按钮）；
var vehicleMakeText=document.body.queryselectoral（“.vehicleMakeText”）；
对于（变量i=0；i

我复制了两行来帮助您定位第二行

document.querySelector(".vehicle-details").innerHTML = vehicleDataSummaryOutput;
populateSummaryBlocks(response.vehicle);

populateSummaryBlocks

在单击和请求就绪时都会被调用。您只需要从onClick事件侦听器调用它

---

通过向按钮添加事件侦听器，并在事件上调用“防止默认”方法，可以禁用按钮的默认行为，如下所示：

button.addEventListener('click', function(event) {
    event.preventDefault();
}

---

我复制了两行来帮助您定位第二行

document.querySelector(".vehicle-details").innerHTML = vehicleDataSummaryOutput;
populateSummaryBlocks(response.vehicle);

populateSummaryBlocks

在单击和请求就绪时都会被调用。您只需要从onClick事件侦听器调用它

---

通过向按钮添加事件侦听器，并在事件上调用“防止默认”方法，可以禁用按钮的默认行为，如下所示：

button.addEventListener('click', function(event) {
    event.preventDefault();
}

---

这可能与您的问题无关，但是if（document.querySelector（'input[name=“input_52”]：checked'）.value=“standard”）和}else if（document.querySelector（'input[name=“input_52”]：checked'）.value=“special”）应该使用==（比较）而不是单个=（赋值）符号。您正在调用方法

populateSummaryBlocks（response.vehicle），那么您期望什么呢？这可能与您的问题无关，但是if（document.querySelector（'input[name=“input\u 52”]：checked'）.value=“standard”）和}else if（document.querySelector（'input[name=“input\u 52”]：checked'）.value=“special”）应该使用==（比较）而不是单个