Question

我正在开发一个基于JavaScript的页面，它返回交付成本，具体取决于用户选择的内容（区域，服务（前12等）和权重）。因为我不认识JS，所以我已经糊里糊涂了。

我的问题是：

我可以在函数之间传递变量 - 详见下面的脚本吗？
一旦达到上述目标，我需要处理变量以显示结果，现在我可以做一个大规模的ifelse，不是真的想要因为会有30多种可能性。所有必需的信息都在SQL DB中，所以这将是我的首选，但我不知道如何使用JS，整个浏览器端，服务器端问题。我是否需要将变量（如上所述）传递给PHP（一旦设置了所有3个）以从SQL DB中获取数据？如果是这样，我不知道该怎么做。

如果我确实使用PHP，则必须重新加载页面，是否可以让用户无缝连接，即所有选择仍然显示？

function flag(nation, area) {
  this.nation = nation;
  var el = document.getElementById("desc");
  el.innerHTML = 'The region you have selected is <b>' + area + '</b>';
  document.getElementById("flag").innerHTML = '<img src="images/flags/' + nation + '.jpg">';
}

function output(service) {
  this.service = service;
  var el = document.getElementById("service-desc");
  el.innerHTML = 'You have selected a <b>' + service + '</b> service.';
  document.getElementById("clock").innerHTML = '<img src="images/clock-' + service + '.png">';
}

function result() {
  //get varibles(nation & serive) from functions above ~ not sure how to do this!
  //process varibles
  if (nation == "UK" && service == "Standard next day") {
    document.getElementById("result").innerHTML = '£9.99';
  } else if (nation == "UK" && service == "Before 12pm") {
    document.getElementById("result").innerHTML = '£14.99';
  }
  // etc,etc,etc....
  else {
    document.getElementById("a1").innerHTML = "";
  }
}

Answer 1

基本上有三种选择：

让PHP脚本将页面上的所有数据作为JavaScript数组放置，并处理JavaScript中的所有内容。如果数据总量不是太多，这是一个很好的解决方案
当用户进行选择并处理PHP中的所有内容（包括保留现有选择）时，重新加载整个页面 - 这是使其无需JavaScript的唯一方法，但只有其他方面的缺点。
当用户进行选择时使用AJAX，即JavaScript在后台调用服务器，而特殊的PHP脚本仅返回JavaScript随后使用的相关数据（通常使用JSON格式）更新页面。这就是现在通常所做的事情。

Answer 2

您想要AJAX - 在PHP中编写服务器端数据源，在JS中编写浏览器端迷你应用程序，与服务器源进行通信并相应地更新网页。这是使用Javascript的XMLHttpRequest对象实现的。我强烈建议你学习使用它然后依赖一个包装它的JS库并提供更高级别的服务（比如jQuery）

Answer 3

在javascript中，如果在函数外部声明变量，则可以在任何函数中使用它，这是一个全局变量。 E.g。

var x, y;
function flag(nation,area)
{
  x = nation;
  y = area;
}
function output(service)
{}    
function result() {
  //In here you can do whatever you want with x and y
}

您最好创建一个PHP脚本，从数据库中获取数据并将其返回给您的javascript。执行此操作的最佳方法是进行AJAX调用，这将允许您无缝地从数据库中获取所需的数据，并且只更新页面的特定部分而不是整个页面。

我建议您查看jQuery，因为它有一些非常容易使用的AJAX方法。它只是一个包装javascript的库，并且具有许多易于使用的功能，很好的介绍视频here

这是关于如何使用jQuery调用从数据库获取数据的PHP脚本的tutorial。

JavaScript在函数之间传递变量并处理它们

3 个答案: