如何通过 jQuery Load 传递两个或多个变量

Question

我从这里获得了世界数据库：https://code.google.com/p/worlddb/

我已经建立了数据库，通过使用 php、mysql 和 jquery，我正在尝试生成一个三级选择下拉菜单，以从地区和国家/地区生成城市列表。

我正在做的是选择国家下拉列表，通过包含区域的 jquery 加载外部文件。然后选择区域，通过 jquery 触发另一个外部加载来填充城市。

$(document).ready(function() {
// get states names based on country drop down
$("#ddCountry").change(function() {
$("#ddStates").load("includes/getStates.php?choice2=" + $("#ddCountry").val());
$("#ddCountryCode").load("includes/getCountryCode.php?choice1=" + $("#ddCountry").val());
});
// get city name for specific state
$("#ddStates").change(function() {
$("#ddCity").load("includes/getCities.php?choice3=" + $("#ddStates").val());
});
});

这工作正常。问题是城市表需要两个参数来加载一个地区的城市。一个是地区代码，另一个是国家代码。当我在与 $choice1 相同的页面上选择国家/地区时，我已经填写了国家/地区代码。

我需要这部分

$("#ddStates").load("includes/getStates.php?choice2=" + $("#ddCountry").val());

传递两个变量而不是一个。目前它传递的单个变量#ddCountry 值。我需要将更多值传递给它，即#ddCountryCodeGot，它正在被检索为 id #ddCountryCode 中的输入值。

如何将两个变量传递给通过此行调用城市的页面

$("#ddStates").load("includes/getStates.php?choice2=" + $("#ddCountry").val());

如果我这样做：

$("#ddStates").load("includes/getStates.php?choice2=" + $("#ddCountry").val()&choice4=" + $("#ddCountryCodeGot").val());

它会触发错误。 提前致谢。

从下面的答案中得到解决方案：这里是更新的正确代码，正在运行。

$(document).ready(function() {
// get states names based on country drop down
$("#ddCountry").change(function() {
$("#ddStates").load("includes/getStates.php?choice2=" + $("#ddCountry").val());
$("#ddCountryCode").load("includes/getCountryCode.php?choice1=" + $("#ddCountry").val());
});
// get city name for specific state and the country code - passing two variables to the cities page
$("#ddStates").change(function() {
$("#ddCity").load("includes/getCities.php",{choice3:$("#ddStates").val(),choice4:$("#ddCountryCodeGot").val()});
});
});

更新 虽然上述方法有效 正如 Du D 在下面的 cmets 中所建议的那样 - 它也可以像下面这样完成：

$("#ddCity").load("includes/getCities.php?choice3=" + $("#ddStates").val() + "&choice4=" + $("#ddCountryCodeGot").val());

Answer 1

这带来了我非常喜欢的 jquery ajax 方法的一个方面，它能够为作为 HTTP 参数传递的 URI 提供值的哈希值。这允许您保留离散数据，避免为 URI 拼凑字符串的逃避噩梦。

在文档中引用可选的“数据”原型 .load：

.load( url [, data ] [, complete(responseText, textStatus, XMLHttpRequest) ] )

所以，你可以这样做：

$("#ddStates").load("includes/getStates.php",
                      {choice2: $("#ddCountry").val(),
                       choice4: $("#ddCountryCodeGot").val()
                      }
                    );

有时，您必须深入研究文档以了解 jquery 和 jquery 插件如何将数据传递给这样的请求，但我更喜欢这种方法。

Answer 2

您可以将任意数量的变量（最多为服务器最大字符数）放入查询中，即问号后面的部分。你用＆符号分隔它们。

例如，发送 thing1 = x 和 thing2 = y：

page.php?thing1=x&thing2=y