我正在创建一个在特定月份包含不同事件的移动网站。我想在每个事件页面上添加一个按钮,让用户添加不同的“收藏夹”。我希望当用户单击“添加到收藏夹”按钮时,该事件应自动添加到 html 页面“收藏夹”
1 回答
I would go with a small javascript, external and called on the event pages (since there will be many instances of it). It's actually a very simple process you're asking about.
- Create a new javascript file called favorites.js
- Save it with this code:
Modified To support Opera
function bookmark(title,url){
var sPath = window.location.pathname;
var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
url =url+sPage;
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);
}
In the head of every HTML document you write, you need to call this script (extremely similar to calling a CSS definition):
<script src="**/dir/**favorites.js" charset="UTF-8" type="text/javascript" defer/></script>
Defer is optional but recommended with a script like this which is not essential to the functioning of the page. However, if you want the possibility that the user can make use of the add to bookmarks function before the rest of the page loads, you may change defer to async.
Now you're almost there. At this point, to save yourself some frustration, make sure that your pages load without error before trying to use a link. This will ensure there are no bugs with your javascript or existing code.
To make use of the add to favorites button, it's as simple as using anchors and links. A link which would make use of this script in particular looks like this:
<a href="javascript:bookmark()">bookmark me</a>
or
<a href="javascript:bookmark()"><img src="imgs/bookmarklogo.png" **other-img-definition-stuff**></a>
And in the old days it was common to use a form button, like this:
<input type="button" name="Bookmark this page" onclick="bookmark()" />
Several years have gone by since I really bothered myself with HTML/CSS, and in that time, options such as AddThis have come about. If you find this task too difficult, I would just go with something like that. And also I would recommend getting away from handcoding and go to some sort of CMS, like Drupal or Wordpress. Especially if you are on tight schedules.