Question

正如标题所述。

我正在尝试根据模型中的某些值添加标题。

目前它看起来像这样。

foreach (var track in Model)
        {
            if (track.G1)
            { 
                <script type="text/javascript">
                    jQuery(".model-attribute-wrapper").addClass("G1");
                </script>
            }
            else if (track.Handicap)
            { 
                <script type="text/javascript">
                    jQuery(".model-attribute-wrapper").addClass("handicap");
                </script>
            }
            else if (track.Special)
            { 
                <script type="text/javascript">
                    jQuery(".model-attribute-wrapper").addClass("special");
                </script>
            }
            else if (track.BestRight)
            { 
                <script type="text/javascript">
                    jQuery(".model-attribute-wrapper").addClass("bestright");
                </script>
            }
            else if (track.Dirt)
            { 
                <script type="text/javascript">
                    jQuery(".model-attribute-wrapper").addClass("dirt");
                </script>
            }
            if (even)
            {
                even = false;

                <div class="model-attribute-wrapper even">
                    <div class="model-attribute xx-small">@Html.DisplayFor(modelItem => track.Id) </div>
                    <div class="model-attribute huge">@Html.DisplayFor(modelItem => track.Name) </div>
                    <div class="model-attribute small">@Html.DisplayFor(modelItem => track.Handicap) </div>
                    <div class="model-attribute small">@Html.DisplayFor(modelItem => track.Special) </div>
                    <div class="model-attribute small">@Html.DisplayFor(modelItem => track.Dirt) </div>
                    <div class="model-attribute medium">@Html.DisplayFor(modelItem => track.BestRight) </div>
                    <div class="model-attribute small">@Html.DisplayFor(modelItem => track.G1) </div>
                    <div class="model-attribute small">@Html.DisplayFor(modelItem => track.Distance) </div>
                    <div class="model-attribute action">
                        <div class="model-action">@Html.ActionLink("Edit", "Edit", new { id = track.Id }) </div>
                        <div class="model-action">@Html.ActionLink("Delete", "Delete", new { id = track.Id }) </div>
                    </div>
                </div>
            }
            else
            {
                even = true;
               <div class="model-attribute-wrapper odd"> 
                    <div class="model-attribute xx-small">@Html.DisplayFor(modelItem => track.Id) </div>
                    <div class="model-attribute huge">@Html.DisplayFor(modelItem => track.Name) </div>
                    <div class="model-attribute small">@Html.DisplayFor(modelItem => track.Handicap) </div>
                    <div class="model-attribute small">@Html.DisplayFor(modelItem => track.Special) </div>
                    <div class="model-attribute small">@Html.DisplayFor(modelItem => track.Dirt) </div>
                    <div class="model-attribute medium">@Html.DisplayFor(modelItem => track.BestRight) </div>
                    <div class="model-attribute small">@Html.DisplayFor(modelItem => track.G1) </div>
                    <div class="model-attribute small">@Html.DisplayFor(modelItem => track.Distance) </div>
                    <div class="model-attribute action">
                        <div class="model-action">@Html.ActionLink("Edit", "Edit", new { id = track.Id }) </div>
                        <div class="model-action">@Html.ActionLink("Delete", "Delete", new { id = track.Id }) </div>
                    </div>
                </div>
            }
        }

这似乎不起作用，因为它在前两行中添加了大量的类，然后它逐渐似乎没有添加一个。

Answer 1

您的问题有些令人困惑，但似乎您在页面中创建内容之前尝试添加类。在DOM准备好之前，您需要使用jQuery.ready()函数等待应用类。例如：

jQuery(function(){
   jQuery(".model-attribute-wrapper").addClass("G1");
});

学习参考：jQuery .ready()

Answer 2

掌握执行环境。

在呈现页面时，ASP服务器会在服务器上运行。

JavaScript内容在浏览器上运行（在页面呈现完成后）。

此外，所有jQuery选择器都是相同的。

Answer 3

这里看起来有点不对，这当然不会执行，需要类似jQuery的ready（），但即使每个人都有jQuery.ready（），每次这个代码为Model中的每个轨道执行时，它都会抓取任何东西具有“.model-attribute-wrapper”并将继续添加该类。最后，最后一个将包含模型中所有先前执行的轨道类。

我认为你需要通过id或者其他东西处理每个轨道而不是泛型类“.model-attribute-wrapper”

$(document).ready(function(){ 
  $("#trackid").addClass("G1"); // something like this 
});

在MVC foreach循环中使用jquery将css类添加到div中

3 个答案: