使用javascript追加主网址而不刷新页面不起作用

时间:2015-02-18 05:23:16

标签: javascript jquery html5

我有一个页面上的视频列表,当我点击视频图标时,我会在同一页面上播放每个视频,我的示例页面网址就像

www.xyz.com/video/

现在我必须以这样的方式追加网址:当用户点击视频图标时,它还应该在同一页面上播放该特定视频,并将网址更改为

www.xyz.com/video/XhskwaJS没有刷新页面。这背后的逻辑是分享让用户分享每个视频的能力,而不是列出几个视频的主视频页

我在事件点击时使用以下代码来提取VideoID并尝试将其附加到主URL

var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/;
var URL = 'http://www.youtube.com/embed/Se1y2R5QRKU?showinfo=0&modestbranding=1'              
var match = URL.match(regExp);
                if (match && match[7].length == 11) {
                    //console.log(match[7]);
                    location.href = $(this).attr('href') + match[7];
                    return match[7];
                } else {
                    //alert("Could not extract video ID.");
                }

1 个答案:

答案 0 :(得分:2)

您的正则表达式在应用youtube.com地址时无法匹配,因为它需要youtu.be

也许你可以通过为嵌入和观看网址指定一个替代方案来简化正则表达式

^[^?]+/embed/([^?]+)\?
^[^?]+/watch\?v=([^&]+)

最后,不要设置触发刷新的location.href,而是使用html5历史记录api并编写

window.history.replaceState('Object', 'Title', $(this).attr('href') + match[7]);