为什么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规范。