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

Question

我需要在用户从下拉列表中选择所选值后显示一个表格。我试图在互联网上搜索编码的例子，但我没有找到任何。我的编码如下：

<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 | 

有人能帮助我，请...

Answer 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>"); 
    } 
} 

这只是一个非常难看又快速的例子，只是展示了你可能会看到的东西。你想要的是在谷歌肯定，只是不断尝试。这应该给你足够的跳跃开始。

Answer 2

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

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