我有一個div列表。這是一個div結構:多個div綁定到JQuery函數 - 多次調用函數
<div class="commentWrap" id="@Model.CommentId">
<p id="commentTextValue">@Model.CommentText</p>
<a id="editButton" href="#">Edit</a>
</div>
我想爲div中的每個編輯按鈕附加操作。我通過div ID分開div。當我點擊編輯按鈕時,這是JQuery功能:
$('#editButton').live('click', function (e) {
e.preventDefault();
var container = $(this).closest('div');
var itemId = container.attr('id');
alert(itemId);
})
它工作。它顯示元素的正確ID。
問題是當我有多個div。例如,當我有5個div和點擊一些編輯按鈕提醒消息顯示5次?
我在這裏做錯了什麼?
<div id="messages">
<div style="border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(221, 221, 221); border-right-color: rgb(221, 221, 221); border-bottom-color: rgb(221, 221, 221); border-left-color: rgb(221, 221, 221); ">
<a href="/Comment/SomeAction">Vlada Vucetic</a> 467327
<div class="commentWrap" id="467327">
<p class="commentTextValue">test 4</p>
<a class="editButton" href="#">Edit</a>
</div>
</div>
<div style="border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(221, 221, 221); border-right-color: rgb(221, 221, 221); border-bottom-color: rgb(221, 221, 221); border-left-color: rgb(221, 221, 221); ">
<a href="/Comment/SomeAction">Vlada Vucetic</a> 980339
<div class="commentWrap" id="980339">
<p class="commentTextValue">test 3</p>
<a class="editButton" href="#">Edit</a>
</div>
</div>
<div style="border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(221, 221, 221); border-right-color: rgb(221, 221, 221); border-bottom-color: rgb(221, 221, 221); border-left-color: rgb(221, 221, 221); ">
<a href="/Comment/SomeAction">Vlada Vucetic</a> 166111
<div class="commentWrap" id="166111">
<p class="commentTextValue">test 2</p>
<a class="editButton" href="#">Edit</a>
</div>
</div>
<div style="border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(221, 221, 221); border-right-color: rgb(221, 221, 221); border-bottom-color: rgb(221, 221, 221); border-left-color: rgb(221, 221, 221); ">
<a href="/Comment/SomeAction">Vlada Vucetic</a> 769630
<div class="commentWrap" id="769630">
<p class="commentTextValue">test 1</p>
<a class="editButton" href="#">Edit</a>
</div>
</div>
</div>
你們所有的錨都有相同的id'editButton'嗎?如果是這樣,我一點都不感到驚訝。 –