C# MVC4,每张图片的模式窗口
所以我这里有一个图片代码,它与第一个完美结合,但它不会为下一个更新模式C# MVC4,每张图片的模式窗口,c#,jquery,asp.net-mvc,razor,C#,Jquery,Asp.net Mvc,Razor,所以我这里有一个图片代码,它与第一个完美结合,但它不会为下一个更新模式 <a id="modal-456343" href="#modal-container-456343" role="button" class="btn" data-toggle="modal"><img src="~/Images/@(item.Id).jpg" style="height:100px; width:100px;" /></a>
<a id="modal-456343" href="#modal-container-456343" role="button" class="btn" data-toggle="modal"><img src="~/Images/@(item.Id).jpg" style="height:100px; width:100px;" /></a>
<div class="modal fade" id="modal-container-456343" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
×
</button>
<h4 class="modal-title" id="myModalLabel">
@Html.DisplayFor(modelItem => item.Overskrift)
</h4>
</div>
<div class="modal-body">
<div>
<img id="i" src="~/Images/@(item.Id).jpg" style="width:100%; height:100%">
</div>
</div>
</div>
</div>
</div>
我想让它更新或创建一个新的模式时,点击一个新的图片。你们有什么建议吗
提前感谢。问题是您有重复的id,所以它只适用于第一个,您的html是无效的,因为每个元素都应该有唯一的id,只需提供唯一的id即可使其正常工作,如:
<a id="@("modal-"+item.Id)" href="@("#modal-container-"+item.Id)" role="button"
class="btn" data-toggle="modal">
<img src="~/Images/@(item.Id).jpg" style="height:100px; width:100px;" />
</a>
<div class="modal fade" id="@("modal-container-"+item.Id)" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="true">
或者这样:
<a id="modal-@(item.Id)" href="#modal-container-@(item.Id)" role="button"
class="btn" data-toggle="modal">
<img src="~/Images/@(item.Id).jpg" style="height:100px; width:100px;" />
</a>
<div class="modal fade" id="modal-container-@item.Id)" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="true">