jq点击按钮随机展示产品

原创 starcyh 随笔 js效果 237阅读 2018-02-01 17:52:25 举报

在页面中经常会碰到这样的情况,就是有多个产品的时候,在页面上只显示几个(为了方便表达,我们假如有15个产品,页面中只显示3个),然后给一个“换一批”按钮,当点击按钮的时候,在页面上展示从15个产品中随机挑选出的3个显示在页面上,
第一:先隐藏掉所有产品,供后面使用;
第二:使用while循环,随机一下产品个数的数字,然后定义一下当前数字的那个产品,我们在这里避免重复,先判断当前这个产品是否是隐藏状态,也就是有没有被随机到,如果是隐藏状态,也就是没有被随机到,那么就给这个产品添加显示,然后继续while下一个,直到三个都展示;
第三:因为默认是隐藏状态,所以,在页面展示的时候,就得先随机展示出3个,然后再进行点击执行随机方法
代码如下:
html 代码

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复