案例:模拟京东快递单号查询(当我们在文本框输入内容时,文本框上面自动显示大号字的内容)

案例:模拟京东快递单号查询(当我们在文本框输入内容时,文本框上面自动显示大号字的内容)

案例分析:

  • 快递单号输入内容时,上面的大号字体盒子(con)显示(这里的字号更大)
  • 表单检验用户输入:给表单添加键盘事件
  • 同时把快递单号里面的值(value)获取过来赋值给con盒子(innerText)作为内容
  • 如果快递单号里面内容为空,则隐藏大号字体盒子(con)
  • 注意:keydown 和 keypress 在文本框里面的特点:他们两个事件触发的时候,文字还没有落入文本框中
  • keyup 事件触发的时候,文字以及落入文本框里面了
  • 当我们失去焦点,就隐藏这个con 盒子
  • 当我们获得焦点的时候,并且文本框内容不为空,就显示在这个con 盒子

posted @ 2022-09-19 21:33  chichi0002  阅读(178)  评论(0编辑  收藏  举报