利用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最后一个单词的首字母是大写,不知道为什么,网上搜索的基本上都是小写,而小写测试的根本不起作用,搞得我刚开始搞这个代码的时候走了很多弯路。反正大写我在各个地方测试大写都是有效的,如果无效的人可自行更换首字母试一试。