用于 html 元素列表的 Javascript 不起作用答案

【问题标题】：Javascript for a list of html elements not working用于 html 元素列表的 Javascript 不起作用
【发布时间】：2021-04-13 01:17:22
【问题描述】：

我有问题。当用户使用 javascript 单击跨度图标时，我想显示表格的一些元素。

我没有发现问题。通常我应该点击图标并显示与标题关联的元素列表。我验证，如果显示所有行，我有按标题列出的好列表。

我的观点在这里：


@{
    ViewData["Title"] = "CalendrierPFL";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<br />
<h1 class="text-center">Calendrier PFL</h1>
<br />

<!--https://www.w3.org/WAI/tutorials/tables/irregular/ Pour faire une table avec ce format-->
<table class="table table-bordered">
    <colgroup span="2"></colgroup>
    <colgroup span="2"></colgroup>
    <tr class="text-center">
        <td rowspan="2">Zones</td>
        <th colspan="2" scope="colgroup">Lundi</th>
        <th colspan="2" scope="colgroup">Mardi</th>
        <th colspan="2" scope="colgroup">Mercredi</th>
        <th colspan="2" scope="colgroup">Jeudi</th>
        <th colspan="2" scope="colgroup">Vendredi</th>
        <th colspan="2" scope="colgroup">Samedi</th>
        <th colspan="2" scope="colgroup">Dimanche</th>
    </tr>
    <tr>
        @for (int i = 0; i < 7; i++)
        {
            <th scope="col">Matin</th>
            <th scope="col">Aprèm</th>
        }
    </tr>
    @for (int j = 0; j < Model.InfosZoneCalendrier.Count(); j++)
    {
        <tr>
            <th scope="row">
                @Model.InfosZoneCalendrier[j].NomZone
                <span class="fas fa-caret-down" onclick="showEquipements(@Model.InfosZoneCalendrier[j].NomZone)"></span>
            </th>
            @for (int y = 0; y < Model.InfosZoneCalendrier[j].ListEquipements.Count(); y++)
            {
                <tr class="hide" style="display:none" id="@Model.InfosZoneCalendrier[j].ListEquipements[y]" name="@Model.InfosZoneCalendrier[j].NomZone" >
                    <th style="color:gray">@Model.InfosZoneCalendrier[j].ListEquipements[y]</th>
                </tr>
            }
        </tr>
    }
</table>

@section Scripts
{
    <!-- JS includes -->
    <script type="text/javascript">

        function showEquipements(parameter) {
            var div = document.getElementsByName(parameter);
            var i;
            for (i = 0; i < div.length; i++) {
                if (div[i].style.display == "") {
                    div[i].style.display = "none";
                } else {
                    div[i].style.display = "";
                }
            }        
        }

    </script>
}

提前感谢您的帮助:)

【问题讨论】：

标签： javascript c# html model-view-controller razor

【解决方案1】：

如果有人对此感兴趣，问题就解决了:)

<span class="fas fa-caret-down" onclick="showEquipements(@Model.InfosZoneCalendrier[j].*NomZone*)"></span>

在 NomZone 的地方我放了一个唯一的整数 ID 来区分每个选项。有效！

所以我做了这样的：

<span class="fas fa-caret-down" onclick="showEquipements(@Model.ListResasZone[j].IdZone.ToString())"></span>

【讨论】：