javascript - 如何从 View (cshtml 文件)调用 JS 函数以转到 Bootstrap 轮播控件中的特定幻灯片？

Question

我有以下情况:

1. 我有一个 View ，其中包含 Bootstrap Carousal 控件。

2. View 中有一个“askaQuestion”按钮，如下所示:

   <button id="btnAskQuestion" class="btn btn-primary btn-sm" data-url="@Url.Action("SendMessage", "Messages", new { category = @note.PageName, patientId = @note.PatientId, appointmentId = Model.AppointmentId, Index = noOfForms }) ">"Ask A Question"</button>

基本上，单击此按钮(此按钮仅在轮播的特定幻灯片上可见，而不是在所有幻灯片上可见)，我将用户重定向到不同的 Controller /操作方法，并且由于用户交互而再次将用户重定向到该方法页面，他再次回到同一页面。

现在我的目的是让用户从点击“askaButton”的地方进入同一张轮播幻灯片，而不是强制他从第一张幻灯片重新开始。为此，我保留了最后一个变量，即 Index ；但我不仅仅是无法将他放在同一张幻灯片上。

我尝试了几种差异方法:

1. 已关注 this方法，但不确定何时调用 Javascript 函数 goToSlide() 。

2. 在加载 View 时，尝试为该特定幻灯片设置 class="active"，如下所示。在 ViewBag.index ，我保留了最后一张幻灯片编号，从那里我单击了 askAQuestion按钮。

   <ol class="carousel-indicators"> @for (int slideCount = 0; slideCount < @formCount; slideCount++) { if (@formCount == 1) { <li data-target="#divFormCarousel" data-slide-to="@slideCount" class="active"></li> } else { if (ViewBag.index == 0 || ViewBag.index == null) { <li data-target="#divFormCarousel" data-slide-to="@slideCount"></li> } if (ViewBag.index != 0 && ViewBag.index != null && slideCount == ViewBag.index) { <li data-target="#divFormCarousel" data-slide-to="@slideCount" class="active"></li> } } } </ol>

提前致谢。

Answer 1

删除轮播的类属性，并在您自己的 $(document).ready(function() {}) 中使用 $('#carouselId').carousel() 显式初始化它 处理程序。之后立即发出 $("#carouselId").carousel(number) 以转到特定幻灯片。