我试图了解用户如何在Facebook上共享页面,然后重定向到另一个页面。
我从这个链接中学习:Link
也来自另一个stackoverflow:Link
我不知道哪里出错了,但这是我的源代码。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="jquery-latest.min.js"></script>
<script src="jquery.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
</head>
<style>
* {
margin: 0px;
padding: 0px;
text-decoration:none;
-moz-transition: all 0.5s ease 0s;
-o-transition: all 0.5s ease 0s;
-webkit-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
}
body {
background:rgb(249, 249, 249);
font-family:"Lato", Calibri, Arial, sans-serif;
}
.container > div > p {
text-align: center;
margin:40px auto;
}
.fsl, content-download {
display: table;
margin:40px auto;
padding: 6px;
border-radius: 2px;
opacity: 0.6;
}
.fsl-facebook {
background:#14A0E9;
}
.content-download {
background:#6DC118;
display: none;
}
.content-download.unlocked {
display: table;
}
.fsl span {
color: #FFF;
}
.fa-icons {
font-family: FontAwesome;
font-size: 20px;
color: #FFF;
}
.fsl:hover {
opacity: 1;
}
.hidden {
display: none;
opacity: 0;
}
</style>
<body>
<center>
<div class="container">
<div>
<p>This file is locked, to unlock and download it, share it</p>
<p class="hidden">Thanks for sharing, the file is unlocked and ready for download</p>
<p class="hidden">In order to download this file, you need to share it</p>
</div>
<a class="fsl fsl-facebook" href="#" id="facebook-share">
<span class="fa-facebook fa-icons fa-lg"></span>
<span class="sc-label">Share on Facebook</span>
</a>
<a class="fsl content-download" href="" id="download-file">
<span class="fa-download fa-icons fa-lg"></span>
<span class="sc-label">Download File</span>
</a>
</div>
<div id="fb-root"></div>
<script>
$(document).ready(function () {
window.fbAsyncInit = function() {
FB.init({
appId : '553435274702353',
version : 'v2.0'
});
};
$('#facebook-share').on('click', function() {
/** display the share dialog and wait for the response **/
setTimeout(function(){ $('p').addClass('hidden') }, 1500);
FB.ui({
display: 'popup',
method: 'share',
href: 'https://developers.facebook.com/docs/',
},
/** our callback **/
function(response) {
if (response && response.post_id) {
/** the user shared the content on their Facebook, go ahead and continue to download **/
$('p:eq(1)').removeClass('hidden');
$('p:eq(0), #facebook-share').addClass('hidden');
$('#download-file').addClass('unlocked');
} else {
/** the cancelled the share process, do something, for example **/
$('p:eq(2)').removeClass('hidden');
}
});
});
});
// Load the SDK
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
</center>
</body>
</html>
点击分享按钮后,我的错误如下: Link
此外,我找到了一种方法,让页面在分享后重定向。
我真的需要帮助。