以下分享自: 如何给网站增加“添加到收藏夹”
给网站添加“添加到收藏夹”理论上应该是很简单的事情,但是受到各种浏览器和操作系统的不一致的问题,使得这个问题异常的繁琐啊。
下面是梳理的一些资料,仅供参考。
首先是使用快捷键进行添加,如我们熟知的“Ctrl+D”,但是并不是说有的电脑都支持这么操作。键盘快捷键:Ctrl+D 仅适用于 Windows 和Linux);⌘-D 才适用于苹果机(苹果机上没有Ctrl键)。
方案一:使用Javascript模拟键盘操作
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
|
BookmarkApp =
function
() {
var
isIEmac =
false
;
var
isMSIE = (-[1,]) ?
false
:
true
;
var
cjTitle =
"Welcome to CodeCTO.com"
;
var
cjHref = location.href;
function
hotKeys() {
var
ua = navigator.userAgent.toLowerCase();
var
str =
''
;
var
isWebkit = (ua.indexOf(
'webkit'
) != - 1);
var
isMac = (ua.indexOf(
'mac'
) != - 1);
if
(ua.indexOf(
'konqueror'
) != - 1) {
str =
'CTRL + B'
;
// Konqueror
}
else
if
(window.home || isWebkit || isIEmac || isMac) {
str = (isMac ?
'Command/Cmd'
:
'CTRL'
) +
' + D'
;
// Netscape, Safari, iCab, IE5/Mac
}
return
((str) ?
'Press '
+ str +
' to bookmark this page.'
: str);
}
function
isIE8() {
var
rv = -1;
if
(navigator.appName ==
'Microsoft Internet Explorer'
) {
var
ua = navigator.userAgent;
var
re =
new
RegExp(
"MSIE ([0-9]{1,}[\.0-9]{0,})"
);
if
(re.exec(ua) !=
null
) {
rv = parseFloat(RegExp.$1);
}
}
if
(rv > - 1) {
if
(rv >= 8.0) {
return
true
;
}
}
return
false
;
}
function
addBookmark(a) {
try
{
if
(
typeof
a ==
"object"
&& a.tagName.toLowerCase() ==
"a"
) {
a.style.cursor =
'pointer'
;
if
((
typeof
window.sidebar ==
"object"
) && (
typeof
window.sidebar.addPanel ==
"function"
)) {
window.sidebar.addPanel(cjTitle, cjHref,
""
);
// Gecko
return
false
;
}
else
if
(isMSIE &&
typeof
window.external ==
"object"
) {
if
(isIE8()) {
window.external.AddToFavoritesBar(cjHref, cjTitle);
// IE 8
}
else
{
window.external.AddFavorite(cjHref, cjTitle);
// IE <=7
}
return
false
;
}
else
if
(window.opera) {
a.href = cjHref;
a.title = cjTitle;
a.rel =
'sidebar'
;
// Opera 7+
return
true
;
}
else
{
alert(hotKeys());
}
}
else
{
throw
"Error occured.\r\nNote, only A tagname is allowed!"
;
}
}
catch
(err) {
alert(err);
}
}
return
{
addBookmark : addBookmark
}
}();
|
如果嫌上面的方案比较麻烦,可以采用jQuery来快速搞定。具体实现如下:
1
2
3
4
|
var
evt = jQuery.Event(
"keypress"
);
evt.keyCode = 100;
// d
evt.ctrlKey =
true
;
$(document).trigger(evt);
|
方案二:采用Javascript来添加书签
以下是一段能自动把当前页面添加到浏览器书签的JavaScript 脚本,支持 FireFox,Opera 和 IE,Webkit 核心的 Safari 和Chrome 暂时没有实现类似功能的方法。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
function
bookmark(url, title){
if
(window.sidebar)
// firefox
window.sidebar.addPanel(title, url,
""
);
else
if
(window.opera && window.print){
// opera
var
elem = document.createElement(
'a'
);
elem.setAttribute(
'href'
,url);
elem.setAttribute(
'title'
,title);
elem.setAttribute(
'rel'
,
'sidebar'
);
elem.click();
}
else
if
(document.all)
// ie
window.external.AddFavorite(url, title);
else
alert(
'Your browser does not support this function.'
);
}
|
同样的,也提供另外的jQuery方案:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
$(document).ready(
function
(){
$(
"a.jQueryBookmark"
).click(
function
(e){
e.preventDefault();
// this will prevent the anchor tag from going the user off to the link
var
bookmarkUrl =
this
.href;
var
bookmarkTitle =
this
.title;
if
(window.sidebar) {
// For Mozilla Firefox Bookmark
window.sidebar.addPanel(bookmarkTitle, bookmarkUrl,
""
);
}
else
if
( window.external || document.all) {
// For IE Favorite
window.external.AddFavorite( bookmarkUrl, bookmarkTitle);
}
else
if
(window.opera) {
// For Opera Browsers
$(
"a.jQueryBookmark"
).attr(
"href"
,bookmarkUrl);
$(
"a.jQueryBookmark"
).attr(
"title"
,bookmarkTitle);
$(
"a.jQueryBookmark"
).attr(
"rel"
,
"sidebar"
);
}
else
{
// for other browsers which does not support
alert(
'Your browser does not support this bookmark action'
);
return
false
;
}
});
});
|
相应的HTML代码如下:
1
|
|
@挨踢前端