我在我的网站上使用Twitter Bootstrap轮播来显示一组图像。 我想知道是否可以允许链接到轮播中的特定幻灯片。 因此，在10个幻灯片中，用户可以单击链接，直接从a href链接进入第5张幻灯片。
这在Bootstrap Carousel上是否可行，还是我想错了方向？
编辑
嗨，所以我在document.ready函数下添加了以下内容：
但是在url中输入www.example.com/models.php/5没有任何反应。
我做错了什么吗？
var url = window.location.href;
var slide = url.substring(url.lastIndexOf('/')+1); // 4
goToSlide(slide);
function goToSlide(number) {
$("#MyCarousel").carousel(number);
}
您可以使用data-slide-to属性来实现此目的，该属性接受从零开始的索引表示幻灯片编号。
使用数据属性轻松控制走马灯位置。
data-slide接受关键字prev或next，这会相对于其当前位置更改幻灯片位置。 或者，使用data-slide-to将原始幻灯片索引传递给走马灯data-slide-to="2"，这将将幻灯片位置移动到以0开始的特定索引。
只需为您的链接添加属性即可。
<a href="#" data-slide-to="5">Go to slide #5</a>
感谢Cawas在这个答案下的评论和Jonas在这个问题上的回答
你需要使用.carousel(number)函数。
.carousel(number)
将轮播图循环到特定帧（从0开始，类似于数组）。
更具体地说：
创建一个JavaScript函数进行调用，它应该像这样：
function goToSlide(number) {
$("#carousel").carousel(number);
}
然后，在您的链接上添加一个onClick事件即可。
<a href="#" onClick="javascript:goToSlide(5);">Go to slide #5</a>
源链接为www.example.com/models.php/4
您可以在document.ready中检查url，如果url末尾有数据，则只需调用您的goToSlide函数。
var url = window.location.href;
var slide = url.substring(url.lastIndexOf('/')+1); // 4
// Remove the trailing slash if necessary
if( slide.indexOf("/") > -1 ) {
var slideRmvSlash = slide.replace('/','');
slide = parseInt(slideRmvSlash);
}
goToSlide(slide);
data-slide 接受关键字 prev 或 next，它们会相对于当前位置更改幻灯片的位置。或者，使用 data-slide-to 来传递原始幻灯片索引到走马灯中，例如 data-slide-to="2"，它将把幻灯片位置移动到从 0 开始的特定索引位置。继承Seçkin的答案，我必须执行两个小字符串操作才能使我的slide字符串可用。这两个修改让goToSlide函数可以正确解析外部链接。
从URL中去掉末尾斜杠。（我的网站Web服务器会插入斜杠。）
var slideRmvSlash = slide.replace('/','');
var slideInt = parseInt(slideRmvSlash);
之后它正常工作了。
goToSlide(slideInt)
<a href="#" data-slide="5">...</a>，然后在JS中编写处理程序，如$("[data-slide]").click(function(e){ e.preventDefault(); ... });。 - moonwave99<a href>与问题无关，但是在那里有一个进一步的、也许是巧合的优化步骤（看起来@moon没有注意到），我通过Jonas下面的回答意识到了这一点：对于a href，我们可以只使用data-slide="next"或在这种情况下使用data-slide=2，不需要进一步的javascript。它在文档中有说明（http://getbootstrap.com/javascript/#carousel）。 - cregox