今天完成的事情：            

1.准备了ppt，完成了小课堂分享；

2.完成了最新职位的轮播展示，以及跳转到职位详情页面的页面数据渲染；

3.去懒加载官网找了相关资料，实现了懒加载。

明天计划的事情：

1.完成找精英页面；（banner图的获取，静态页面的展示，以及下面更多公司部分的数据获取和展示）

遇到的问题：

1.bootbox时，能出现模态框的效果，不知道如何绑定对应的事件；后来在官网找到了方法：

$(document).on("click", ".alert", function(e) {e}；"click"为执行的操作；".alert"为选择方式，这是是按类选择，也可以使用id选择。

收获：

1.对bootbox的三种使用方式有所了解。详细资料整理在了小课堂资料里面。

2.把懒加载的问题解决了，好多东西还是直接去官网看比较好，别人分享出来的快捷，但是不全面。

小课堂：

1.背景介绍

Bootbox.js是一个小型的JavaScript库，基于 Twitter 的 Bootstrap 开发。它允许你创建使用编程对话框。方便用户快速创建模拟框。

2.知识剖析

该库提供了三个旨在模仿其原生JavaScript等效项的函数。他们的确切的函数名是灵活的，因此每个可以采取各种参数来定制标签和指定默认值，但它们最基本是这样：

（1）警告：bootbox.alert(message, callback)

（2）提示：bootbox.prompt(message, callback)

（3）确认：

bootbox.confirm({
    title: "Destroy planet?",
    message: "This is a confirm with custom button text and color! Do you like it?",
    buttons: {
        confirm: {
            label: 'Yes',
            className: 'btn-success'
        },
        cancel: {
            label: 'No',
            className: 'btn-danger'
        }
    },
    callback: function (result) {
        console.log('This was logged in the callback: ' + result);
    }
});

这三个函数中的每一个都可以调用第四个公共函数，你也可以使用它来创建自己的自定义对话框：

bootbox.dialog(options)；

可以用来定义加载时的等待；

var dialog = bootbox.dialog({
    message: '<p class="text-center">Please wait while we do something...</p>',
    closeButton: false
});
// do something in the background
dialog.modal('hide');

类似这种效果；

3.常见问题

bootbox的所有版本都是在Bootstrap和jQuery的基础之上的，因此bootstrap，jQuery和bootbox的版本要对应

4.解决方案

（1）官网给出了各个版本的使用。

（2）对话框代码不阻止代码执行，由于这个限制，在用户关闭对话框之前不应该运行的代码应该放置（或调用）在对话框的回调函数中。

 （3）注意脚本引用的顺序

jQuery
Bootstra

Bootbox

5.编码实战

警告（alert）：基本用法

bootbox.alert("This is the default alert!");

警告：带回调

bootbox.alert("This is an alert with a callback!", function(){
                     console.log('This was logged in the callback!');
                     });

设置框大小

bootbox.alert({
                              message: "This is the small alert!",
                              size: 'small'
                      });

确认（confirm）：基本用法

bootbox.confirm("This is the default confirm!", function(result){
  console.log('This was logged in the callback: ' + result);
                        });

提示（prompt）：基本用法

bootbox.prompt("This is the default prompt!", function(result){ console.log(result); });

日期提示：

              bootbox.prompt({
    title: "This is a prompt with a date input!",
    inputType: 'date',
    callback: function (result) {
        console.log(result);
    }
});

还有密码，邮箱等，都是修改对应的inputType的值即可。

6.扩展思考

如何将bootbox和对于的按钮绑定

$(document).on("click", ".alert", function(e) {e}；"click"为执行的操作；".alert"为选择方式，这是是按类选择，也可以使用id选择。

7.参考文献

http://bootboxjs.com/

8.拓展思考：

bootbox和ui-bootstrap模态框的优劣。