从另一页链接到某个bootstrap轮播幻灯片
我有两个.html页面:https://stackoverflow.com/questions/34539058/linking-to-a-certain-bootstrap-carousel-slide-from-another-page/page1.html和page2.html
在https://stackoverflow.com/questions/34539058/linking-to-a-certain-bootstrap-carousel-slide-from-another-page/page1.html我有一个旋转木马
Item 1
Item 2
Item 3
(这是最重要的部分)
在page2.html我有一个链接:
Click me to go to page 3!
我将什么添加到链接和我的轮播中以使其全部正常运行? 我找到了这个答案,但不明白如何实现它。
这是您链接中的代码我添加了注释来解释它正在做什么。
function getSlideParameter(key) { /*I'm not sure why would anyone choose a key with these special characters but, * but if they do, following RegEx will replace those special characters */ key = key.replace(/[*+?^$.\[\]{}()|\\\/]/g, "\\$&"); // escape RegEx meta chars //searches the URL for occurrence of &key=some number, in case key is 'slide' it's searching for &slide=some number var match = location.search.match(new RegExp("[?&]" + key + "=([^&]+)(&|$)")); //replaces any '+' with single space var slide = match && decodeURIComponent(match[1].replace(/\+/g, " ")); //checking if 'slide' is an integer and not float and that 'slide' is not a string if (Math.floor(slide) == slide && $.isNumeric(slide)) return parseInt(slide); else return 0;//if 'slide' parameter is not present or doesn't have correct values load 0th slide } //finally load a particular slide using qs() function $('#myCarousel').carousel(getSlideParameter('slide'));
此函数只是试图找到名为“slide”的URL查询参数的值。
因此,如果当前url是http://stackoverflow.com?hello&slide=2
getSlideParameter('slide')
会给我们2
。
此代码将添加到您的轮播幻灯片所在的页面,在您的情况下是第1页。
将其添加到页面底部或使用jQuery的ready()函数。
Item 1
Item 2
Item 3
最后,我们可以在第2页中给出特定幻灯片的链接,如下所示
Slide 1! Slide 3!
这里的所有都是它的。