2.3 登录-前端

第 10 节 / 共 46 节 课程：ThinkPHP
登录位于顶部菜单，点击“登录”弹出一个模态窗口：
模态窗口就是模拟的窗口，它是用html的模拟出来的窗口，并没有真的打开一个新的小窗口。这里是用的模态窗口是bootstrap的模块。
然后我们输入登录邮箱和密码，以及验证码，再点击登录，并不会有任何反应。因为登录按钮什么函数都没有绑定呢。
我们打开view/public/base.html,在148行，就可以看到登录按钮所在的位置：
然后我们加一个单击事件到这个登录按钮：
现在刷新了页面，再去点击登录，可以看到弹出框“测试”。
如果并没有弹出，检查一下alert有没有写错，特别是引号。
接下来我们引用真正的登录函数doLogin，它已经写好了，在public/js/woniunote.js里面：
首先在base.html上方，加入这两句：
<script type="text/javascript" src="/js/bootbox.js"></script>
<script type="text/javascript" src="/js/woniunote.js"></script>
加入之后base.html是这样的：

然后修改登录按钮的onclick函数为doLogin
现在测试一下，在浏览器按下F12，然后点击“打开开发工具”，下面以edge为例子：
点开控制台，这里会打印错误信息：

先确保错误没有被过滤：
然后点击登录，如果还是之前的弹出窗口“测试”，刷新页面后再点击登录。如果是这个错误：
提示doLogin为定义，那么就是前面的woniunote.js的引用没有写对，如果是404错误，那么说明doLogin函数调用正确了：