爲什麼jQuery函數不能有相同的ID兩個圖像執行

Question

我有我的asp.net MVC應用程序中以下腳本反彈圖像

$(document).ready(function() { 
     $("#to-get-bigger").mouseover(function() { 
      $(this).effect("bounce", { time: 3, distance: 40 }); 
     }); 
    }); 

，並在視圖上我有以下兩種具有相同ID的圖像： -

<a href="@Url.Action("StartAssessment", "StartAssessment", new { assessmentid = Model.AssessmentID })" 
onclick = "return confirm('This will make the Assessment avilable for the regestred user.')" > 
    <img id = "to-get-bigger" border="0" src="@Url.Content("~/content/images/assessment-button1.jpg")" alt="start assessment" /> 
</a> 

<a href="@Url.Action("StartAssessment", "StartAssessment", new { assessmentid = Model.AssessmentID })" 
onclick = "return confirm('This will make the Assessment avilable for the regestred user.')" > 
    <img id = "to-get-bigger" border="0" src="@Url.Content("~/content/images/assessment-button1.jpg")" alt="start assessment" /> 
</a> 

但問題是，jQuery函數將只執行和彈跳一個圖像，而不會在第二圖像上工作,,雖然我已經閱讀了jQuery選擇在這如果#to-get-bigger將返回所有具有此ID的元素d一旦用戶將鼠標移動到任何目標元素上，Jquery函數就會被執行？ BR

Answer 1

具有相同的多個元素id是無效的，並導致類似的問題。 id屬性應該是唯一的。引用多個元素有一個屬性，使用class：

HTML

<a href="@Url.Action("StartAssessment", "StartAssessment", new { assessmentid = Model.AssessmentID })" onclick="return confirm('This will make the Assessment avilable for the regestred user.')" > 
    <img class="to-get-bigger" border="0" src="@Url.Content("~/content/images/assessment-button1.jpg")" alt="start assessment" /> 
</a> 

<a href="@Url.Action("StartAssessment", "StartAssessment", new { assessmentid = Model.AssessmentID })" onclick="return confirm('This will make the Assessment avilable for the regestred user.')"> 
    <img class="to-get-bigger" border="0" src="@Url.Content("~/content/images/assessment-button1.jpg")" alt="start assessment" /> 
</a> 

jQuery的

$(document).ready(function() { 
    $(".to-get-bigger").mouseover(function() { 
     $(this).effect("bounce", { time: 3, distance: 40 }); 
    }); 
}); 

Answer 2

Id必須是唯一的。 jQuery使用的原生JavaScript方法document.getElementById()僅返回找到的具有特定ID的第一個元素。

如果您通過ID選擇使用jQuery的元素，它將只返回一個元素，因爲只能有一個具有該ID的有效元素。雖然在某些情況下我已經看到它的工作，比如jquery角落插件，儘管如此，在沒有使用唯一ID的情況下，在所有瀏覽器中都不起作用。

Answer 3

沒有，它會得到一個編號命名＃的採集到的獲取，更大，並且ID必須在頁面上唯一，您應該使用css類。 http://www.w3.org/TR/html4/struct/global.html#h-7.5.2爲您提供了關於它如何工作的w3c規範。