模拟京东输入单号

    《模拟京东输入单号》

我来讲解一个简单的案例：模拟京东输入单号。具体功能就是在京东快递中查快递单号时，输入内容后上面显示一个字体变大的功能如图所示：

 

当输入框失去焦点或输入框中内容为空时，这个字体变大的框就会消失。

代码原理很简单如下图所示：

样式只需一个 div 和 一个input框就搞定，div用来显示放大后的字体样式，input框就用来输入内容。首先需要获取这两个样式，获取到input框的键盘按下事件，如果输入内容为空时就不现实，如果不为空时就将当前放大文本的div显示出来，并且将当前内容赋值为当前div的文本就实现了快递单号变大的效果。当input失去焦点时就隐藏div，当重新获得焦点并且判断到当前文本不为空时显示div。

这个案例就完成了。