Jquery toggleClass運行多次而不是一次爲這個DOM元素

我有一個mvc視圖，輸出一堆div。全部都有一類用戶項目。這是divs上唯一的課程。但是，當我調用toggleClass應該動畫的div從小div到大div以便查看所有文本。動畫在同一個div的頁面上爲每個div運行一次。Jquery toggleClass運行多次而不是一次爲這個DOM元素

的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有誰知道爲什麼？

來源

2012-05-25 Kevin Donde

沒有人 - 像火箭一樣工作：（看這裏）http://jsfiddle.net/w5nz6/ :)讓我知道這是否有幫助， –

這似乎有點奇怪。你可以在http://jsfiddle.net上創建一個演示嗎？ – nnnnnn

哇jsfiddle是一個很棒的網站。它確實可以在jsfiddle上工作，正如你指出的那樣...但是它仍然不適合我的項目。我也能夠創建一個測試項目，並在該項目中工作。然而，即使使用完全相同的代碼，它仍然在我原來的項目中令人毛骨悚然......我不知道爲什麼... –

jquery是在一個局部視圖，它是在一個循環內的常規視圖呈現。這意味着在原始視圖中放置了許多jQuery代碼副本。所以每個jQuery的副本只運行一次，但由於頁面結構的原因，我提供了很多功能。將來我可能不會在部分視圖中包含jquery/javascript。

來源

2013-07-23 16:01:19

Jquery toggleClass運行多次而不是一次爲這個DOM元素

回答

相關問題