javascript - Ajax 代码在第一次计算后停止

Question

我正在编写计算费用的ajax代码。
它工作正常，但如果我输入第二个操作，它就会停止。

<script>
var weight =   document.getElementById("weight").value;
var ship_type = document.getElementById("ship_type").value;
var eol = document.getElementById("eol").value;
function showFees(e) {
  e.preventDefault();
  if (weight === 0) {
    document.getElementById("txtHint").innerHTML = "no thing";
    return;
  } else {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
    document.getElementById("txtHint").innerHTML = this.responseText;
    }
    };
    xmlhttp.open("GET", "sdr.php?weight=" + weight + "&ship_type=" + ship_type + "&eol=" + eol, true);
    xmlhttp.send();
  }
}
</script>

Answer 1

这是因为您在函数外部获取输入值，并且它第一次加载值，并且在调用 showFees 函数时一次又一次地获取相同的数据。尝试下面的代码来解决这个问题，

var objWeight =   document.getElementById("weight");
var objShip_type = document.getElementById("ship_type");
var objEol = document.getElementById("eol");
function showFees(e) {
  var weight =   objWeight.value;
  var ship_type = objShip_type.value;
  var eol = objEol.value;
  e.preventDefault();
  if (weight === 0) {
    document.getElementById("txtHint").innerHTML = "no thing";
    return;
  } else {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
    document.getElementById("txtHint").innerHTML = this.responseText;
    }
    };
    xmlhttp.open("GET", "sdr.php?weight=" + weight + "&ship_type=" + ship_type + "&eol=" + eol, true);
    xmlhttp.send();
  }
}