如何使用 MVC2 使网页组件（Div、a、h1 等）的 ID 动态（变量？）？

Question

我正在尝试执行以下操作： 我提供给 Viewpage 的对象有一个列表，我在 HTML 中执行 foreach 并创建了许多组件。现在，我希望这些组件的 ID 以某种方式链接到列表中的对象。
（我尝试这样做的原因是因为我想显示一个按钮，当他们按下该按钮时，显示的内容将会改变，他们应该看到其他东西，我将使用javascript来实现这一点）

因此我试图使这些组件的 id 是动态的，例如声明
id="button <%= item.id%>" 但这似乎不起作用。我在谷歌上搜索了很多，但还没有找到解决方案，这就是为什么我向你们求助。

我也会链接我的代码，我删除了一些不必要的部分（但添加了 javascript）：

<script type="text/javascript">
    function AlterPanel(thePanel) {
    var panel = document.getElementById("region"+thePanel);
    panel.style.display = 'block';
    var button = document.getElementById("button"+thePanel);
    button.style.display = 'none';}
</script>
<%foreach (TeamDTO team in Model.List.Teams)
     { %>
    <a id="button<%= team.Number %>" onclick="AlterPanel(<% team.Number%>)">
    Add member</a>
    <div Visible="false" id='region<%= team.Number %>' runat="server">
        Please select one: 
        <%: Html.DropDownListFor(V => V.memberID, new SelectList(Model.members, "ID","Name")) %>
    </div>
<% } %>

我热切地等待回复并提前感谢您。

Answer 1

我猜你的问题是：
-您有一些“按钮 DropDownList”对，按钮可见，DropDownList 不可见，现在如果用户单击按钮，则 DropDownList 将显示。

好吧，现在你的视图可能是：

<%foreach (TeamDTO team in Model.List.Teams)
     { %>
    <a onclick="AlterPanel(<% team.Number%>)">
    Add member</a>
    <div id="region<%= team.Number %>" style="display:none">
        Please select one: 
        <%: Html.DropDownListFor(V => V.memberID, new SelectList(Model.members, "ID","Name")) %>
    </div>
<% } %>

我在 javascript 部分使用 JQuery，如下所示：

<script type="text/javascript">
    function AlterPanel(thePanel) {
        $("#region" + thePanel.toString()).css("display", "block");
    }
</script>

不要忘记在 View() 中包含以下文件：

<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery-1.4.1.min.js") %>"></script>

如果答案不是你想要的，请告诉 mt，我可以帮助你〜:)