网站接入QQ互联教程二 放置“QQ登录”按钮_OAuth2.0
本步骤的作用：
在网站页面上放置“QQ登录”按钮，并为按钮添加前台代码，实现点击按钮即弹出QQ登录对话框。
本步骤在整个流程中的位置：
上一步
1. 下载“QQ登录”按钮图片，并将按钮放置在页面合适的位置
按钮图片下载： 点击这里下载 。
按照UI规范，将按钮放置在页面合适的位置：点击这里查看。
2. 为“QQ登录”按钮添加前台代码
2.1 效果演示
用户在页面上点击“QQ登录”按钮，将触发QQ登录对话框，效果如下图所示：
2.2 前台代码
为了实现上述效果，应该为“QQ登录”按钮图片添加如下前台代码：
<img src=QQ登录图标文件在服务器上的地址 onclick=按钮点击事件>
2.3 代码示例
1. 写一个函数“toLogin()”，该函数通过调用“index.php”中的qq_login函数来实现将页面跳转到QQ登录页面。
（示例中的oauth/index.php，请参见从SDK下载页面下载PHP SDK，在Connect2.1文件夹下的index.php文件。）
<script>
function toLogin()
{
//以下为按钮点击事件的逻辑。注意这里要重新打开窗口
//否则后面跳转到QQ登录，授权页面时会直接缩小当前浏览器的窗口，而不是打开新窗口
var A=window.open("oauth/index.php","TencentLogin",
"width=450,height=320,menubar=0,scrollbars=1,
resizable=1,status=1,titlebar=0,toolbar=0,location=1");
}
</script>
2. 为按钮添加“toLogin()”事件：
<a href="#" onclick='toLogin()'> <img src="img/qq_login.png"></a>
编辑：yimen，如若转载，请注明出处：https://www.yimenapp.com/kb-yimen/14347/
部分内容来自网络投稿，如有侵权联系立删
