阿萌的程序小屋

萌物控重度患者与您一起畅游技术与梦想的世界

利用JavaScript实现加入收藏夹功能的简单实例

最近发现好几位朋友问我要网站点击加入收藏夹的javascript代码,下面为小白和懒人整理与介绍一下相关代码。

其实网上一搜能搜出一大堆,有代码量很长的,也有代码很简洁的,有针对各个浏览器做判断的,无非为的是一个兼容。

阿萌的这个代码还是从简,做到能应对大部分情况,还是老样子,先解释最后再放源码:

一、首先,先看下IE的加入收藏夹代码:window.external.AddFavorite(sURL, sTitle)
虽然大部分人都能看出参数的意义,不过我还是要简介下:sURL表示的是你要收藏的网址,sTitle表示的是对应的所要保存的网站名称。
这个是针对IE标准的代码,如果单独使用可以直接在A标签里定义就好了,比如直接添加oncilck=” window.external.AddFavorite(sURL, sTitle)” 或者href="javascript: window.external.AddFavorite(sURL, sTitle)"。

二、咋们来看看兼容市面上例如火狐、chrome、360等大部分浏览器的代码:window.sidebar.AddPanel(sTitle, sURL, "")
还是如第一段里所说,参数代表的意思是一样的,第三参数直接留空就好了。虽然有消息称火狐在新版本不支持AddPanel函数了,但是之前测试的还是有效的。

三、以防上面2个都不起效的情况下,我们必须制作一个信息弹窗,提示用户按快捷键收藏,以防用户无法收藏的问题。

最终代码:


function AddFavorite(sURL, sTitle) {
    try {
        window.external.AddFavorite(sURL, sTitle);
    } catch(e) {
        try {
            window.sidebar.AddPanel(sTitle, sURL, "");
        } catch(e) {
            alert("加入收藏失败,请使用Ctrl+D进行添加,感谢您对我的关注,您的支持是我最大的动力!");
        }
    }
}

 

调用方法:
1、收藏固定网址,那么直接定义参数就好了,例如onclick="AddFavorite('http://www.wangmengyu.cn/','阿萌的程序小屋')"
2、收藏当前网址,利用代码获取网址即可,例如onclick="AddFavorite('window.location','document.title')"

还有个要强烈需要注意的是,window.external.AddFavorite最后一个单词的首字母是大写,不知道为什么,网上搜索的基本上都是小写,而小写测试的根本不起作用,搞得我刚开始搞这个代码的时候走了很多弯路。反正大写我在各个地方测试大写都是有效的,如果无效的人可自行更换首字母试一试。

 

如有朋友感觉我的博文或代码有问题,愿能给予我宝贵的意见!Thanks

另注:转载请随意,但请带上本文地址,万分感谢。

http://www.wangmengyu.cn/?p=515

这就是真的真的是传说中的公告牌的说~~
暂且努力发展中~~

性别:男  年龄:20岁
现居:江苏  南京  浦口区
标语:萌即是一切