1

我有一个输出一堆 div 的 mvc 视图。都有一类userproject。那是 div 上唯一的类。但是,当我调用 toggleClass 时,它应该将 div 从一个小 div 动画到一个大 div 以便查看所有文本。动画在同一 div 上的页面上为每个 div 运行一次。

jQuery

$(document).ready(function () {

    $(".userproject").click(function (e) {
        $(this).toggleClass("userprojectclicked", "slow");
    });

});

css

.userproject
{
    float: left;
    border:2px solid;
    border-radius:5px;
    width: 270px;
    padding: 15px;
    margin: 5px;
    position: relative;
    background-color: green;
    overflow:hidden;
}

.userprojectclicked
{
    width: 900px;
    background-color: white;
    border-color: green;
}  

在循环中查看下面的 div 输出。

<div class="userproject">

<p>@Html.LabelFor(m => @Model.Name) : @Html.DisplayFor(m => Model.Name)</p>
<p>@Html.LabelFor(m => @Model.Description) : @Html.DisplayFor(m => Model.Description)</p>
<p>@Html.LabelFor(m => @Model.UserId) : @Html.DisplayFor(m => Model.UserId)</p>
<p>@Html.LabelFor(m => @Model.CategoryId) : @Html.DisplayFor(m => Model.CategoryId)</p>

</div>

问题是动画为页面上的每个 div 发生一次......但它发生在同一个 div 上,所以它变大然后变小......大然后小......等等。有谁知道为什么?

4

1 回答 1

0

jquery 位于一个局部视图中,该视图在循环内的常规视图中呈现。这意味着在原始视图中放置了许多 jquery 代码副本。因此,jquery 的每个副本只运行一次,但由于页面的结构,我渲染了许多函数。将来我可能不会在我的部分视图中包含 jquery / javascript。

于 2013-07-23T16:01:19.107 回答