jquery从数据库填充多个下拉列表

我知道如何使用jQuery使用数据库中的值填充单个下拉框。 但现在我需要进行长查询以使用下拉列表过滤掉5个表字段。 也就是说，通过选择第一个，我需要更改剩余的4个下拉列表值，并通过更改第二个下拉列表，我需要更改其他3个下拉列表，依此类推。 为了更改单个下拉列表，我使用Ajax发送到URL，然后返回html并将其放在select字段中。

jQuery.ajax({ type: "POST", url: "getdb/tb", data: '{data : "data" }', success: function (data) { jQuery("select#field_1").html(returnval); }, failure: function (response) { alert("failed"); } }); 

在我的URL“getdb / tb”中，我使用SELECT语句过滤掉查询并回显出选项字段。
但我不知道如何在我的4个其他下拉列表中发送多个html选项字段，并在第一个下拉列表中执行单个更改function。 请帮帮我一个初学者。 提前致谢。

更新：这是一个很好的方式

  jQuery.ajax({ - - success: function(data){ callfirst(); } }); function callfirst(){ jQuery.ajax({ - - success: function(data){ callsecond(); } }); } function callsecond(){ jQuery.ajax({ - - success: function(data){ callthird(); } } 

Answer 1

你的方式很好 – 但它需要许多ajax调用来为所有选择字段带来选项值。 您可以使用JSON在单个ajax调用中完成此操作。 在PHP页面，您可以创建一个数组，其中包含表示四个选择框的选项的HTML字符串。 然后，您可以使用json_encode（）函数将此数组转换为JSON字符串：

 $arr=array("second"=>"..........."..........."..........."........... 

然后在网页上，对于第一个下拉列表，您可以编写如下的jQuery函数：

  function loadOptions(){ jQuery.ajax({ success: function(data){ jQuery("select#field_2").html(data["second"]); jQuery("select#field_3").html(data["third"]); jQuery("select#field_4").html(data["fourth"]); jQuery("select#field_5").html(data["fifth"]); } }); } 

通过这种方式，您可以在一个ajax调用中加载所有其他下拉列表的选项。 我知道您还需要其他下拉列表的类似function。 您也可以为其他下拉列表编写类似的function。 这是一个通用函数，您可以在其中传递下拉数字，该函数将返回目标下拉列表的选项。 例如，如果您传递下拉数字2，该函数将返回下拉列表3,4和5的选项。如果您传递3，它将返回下拉列表4和5的选项，依此类推。

  function loadOptions(selectNo){ jQuery.ajax({ data:{"selectNo",selectNo}, success: function(data){ switch(selectNo){ case 1: jQuery("select#field_2").html(data["second"]); case 2: jQuery("select#field_3").html(data["third"]); case 3: jQuery("select#field_4").html(data["fourth"]); case 4: jQuery("select#field_5").html(data["fifth"]); } } }); } 

在PHP页面上，您可以编写以下代码来实现此function：

 $selectNo=$_GET["selectNo"]; $arr=array(); switch(selectNo){ case 1: $arr["second"]="........... 

有关JSON的更多信息，请访问此处 。