从下拉列表（HTML）中选择所选值后显示表格答案

【问题标题】：Display table after choose the selected value from dropdownlist (HTML)从下拉列表（HTML）中选择所选值后显示表格
【发布时间】：2012-04-17 14:22:25
【问题描述】：

用户从下拉列表中选择选定值后，我需要显示一个表格。我曾尝试在互联网上搜索编码示例，但没有找到。我的编码将是这样的：

<select name="ddlEqu" size="1" tabindex="1" onchange="select(this.value)" id="Equddl_source">
  <option selected value="select"><--Select--></option>
  <option value="D1">T-Shirt</option>
  <option value="D2">Jacket</option>
  <option value="D3">Shoes</option>
</select>

如果用户选择T恤，T恤列表将以表格的形式显示。像这样：

ID    |  T-Shirt      | Description    | Price
1     | Mickey Mouse  | Color = Black  | RM 29.90
2     | Camera Shirt  | Color = Pink   | RM 32.50
3     |               |       = White  |

有人可以帮帮我吗...

【问题讨论】：

你能把你的选择功能也放上来吗？

标签： javascript html

【解决方案1】：

如果可以，请使用 jQuery。然后，您可以轻松提取数据或您需要做的任何其他事情。您甚至不需要执行 select(this.value)，只需创建一个名为“ItemSelectedEvent”之类的函数即可。

var id = 0;

//This uses jquery
function ItemSelectedEvent
{
        id++;
    if($(#Equddl_source).val() == "D1") //Might also try for example (.val() == "Jacket")
    {
        $(#TableName).append("<tr><td>" + id + " | " + $(#Equddl_source).val() + " | </td></tr>");
    }
}

这只是一个非常丑陋且快速的示例，只是展示了您可能会看到的内容。你想要的肯定在谷歌上，继续努力。这应该给你一个足够好的跳跃开始。

【讨论】：

【解决方案2】：

我希望您必须在页面加载时加载所有表格。假设您有 3 个隐藏表，分别用于 ID 为 table_D1、table_D2 和 table_D3 的项目 D1、D2 和 D3。如果表尚未加载，那么您可能应该通过AJAX 获取数据

$('#Equddl_source').change(function () {
   $('#table_' + this.value).show();       
});

【讨论】：