life1st / yesno

a toy help you make choise!

Home Page:http://choise.life1st.cn

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

yesno

功能

一个demo,功能主要是按下按钮,返回yes | no 当然根据api,每10000次会返回一个maybe

One more thing.

缘由是在vue官网上看到了这个接口,自己尝试做着玩了下。

使用vue数据绑定代替JQuery控制文档(不过要多加载30k数据,多一个http请求。), 使用三元运算符代替if语句,代码逻辑更清晰。(由于answer每10000次返回的数据有一个maybe,所以只能使用if)。 获取重复的元素使用变量表示,减少运行时间。 点击获取按钮后使用setInterval()更新按钮文字,避免用户认为页面假死。 点击后为a标签设置.disable类名(使用css设置pointer-events: none;),避免发生重复点击,也避免重复请求数据。 由于图片大小不确定,在ajax获取到图片地址后马上控制页面上的隐藏元素实现预加载。 获取图片加载状态,加载完成后才显示在页面上,通过控制用户等待时间避免白屏问题出现。 使用onload()代替setTimeout(),避免固定延迟出现不必要的时间浪费或者图片未加载完出现白屏。

master是使用vue作为内容容器的版本;vueversion是包含仅使用JQuery的版本,一些细节没有完善。

现已移除

About

a toy help you make choise!

http://choise.life1st.cn


Languages

Language:JavaScript 99.3%Language:HTML 0.4%Language:CSS 0.3%